如何使用Vite创建Vue3+TS的项目

最后有步骤图：可按需自行食用~

前提：安装 Node.js 和 npm（自行安装）

查看是否安装成功：Win+R ——> cmd

node -v 

npm -v

第一步：打开你的终端或命令行 ：win+R ——> 输入cmd

第二步：

• 运行以下命令创建项目：

  npm init vite@latest my-vue-app

• 替换 my-vue-app 为你想要项目的名称。
• 然后，选择你想要使用的框架：
  • 选择Vue。
  • JavaScript: 选择 JavaScript 选项。
  • TypeScript: 选择 TypeScript 选项。
  • 等待 Vite 完成项目创建。

第三步：启动开发服务器 

• 进入创建的项目目录：

  cd my-vue-app

• 安装依赖：

  npm install

• 启动开发服务器：

  npm run dev

• 默认地址是 http://localhost:5173/
• 在浏览器中运行http://localhost:5173/ 

第四步： 开始开发

• 现在你可以在 src 文件夹中开始编写你的 Vue3 代码。

• main.js 或 main.ts 是你的应用程序入口点。
• App.vue 是你的根组件。

第五步：构建项目 

• 当你准备好发布你的项目时，运行以下命令构建项目：

npm run build

• 这将在 dist 文件夹中生成一个生产版本。

 

总结：步骤图 

到这一步一个Vue3+TS项目就创建完成了！！！