首页vite创建vue3项目

vite创建vue3项目

时间: 2023-07-10 08:17:49 浏览: 99

要使用 Vite 创建 Vue 3 项目，需要先确保已经安装了 Node.js 和 npm。然后，按照以下步骤操作： 1. 打开终端，创建一个新的空文件夹，用于存放项目代码。 2. 进入该文件夹，并执行以下命令，初始化一个新的 npm 项目： ``` npm init -y ``` 3. 安装 Vue 3 依赖： ``` npm install vue@next ``` 4. 安装 Vite： ``` npm install vite --save-dev ``` 5. 创建一个新的入口文件，例如 `index.html`，并添加以下代码： ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>My Vue 3 App</title> </head> <body> <div id="app"></div> <script src="/src/main.js"></script> </body> </html> ``` 6. 创建一个新的 JavaScript 文件，并命名为 `main.js`，然后添加以下代码： ```javascript import { createApp } from 'vue'; const app = createApp({ // App 组件 }); app.mount('#app'); ``` 7. 启动开发服务器： ``` npx vite ``` 8. 打开浏览器，并访问 http://localhost:3000，你应该可以看到你的 Vue 3 应用程序正在运行。以上就是使用 Vite 创建 Vue 3 项目的步骤。

阅读全文