使用 npm create vite@latest 可快速创建 Vue3 工程,无需全局安装;需 Node.js ≥18.0.0;支持 npm/yarn/pnpm 三选一初始化,项目含 main.js、App.vue 等核心文件,开箱即用且热更新迅速。

直接用 npm create vite@latest 命令就能快速搭起一个标准 Vue3 工程,整个过程不到一分钟,不需要提前全局安装 Vite 或 Vue CLI。
确认 Node.js 版本
Vite 要求 Node.js ≥ 18.0.0(官方推荐 20+),运行以下命令检查:
node -v
如果版本过低,去 Node.js 官网 下载 LTS 或最新版安装即可。
执行一键初始化
在终端中运行(三选一,推荐 pnpm):
- npm 用户:
npm create vite@latest my-vue-app -- --template vue
- yarn 用户:
yarn create vite my-vue-app --template vue
- pnpm 用户(更快、更节省磁盘):
pnpm create vite my-vue-app --template vue
其中
my-vue-app可替换成你自己的项目名,--template vue表示使用纯 JavaScript 的 Vue3 模板;如需 TypeScript,把vue换成vue-ts。
进入项目并启动
命令执行完后,依次运行:
cd my-vue-app pnpm install # 或 npm install / yarn install pnpm run dev # 或 npm run dev / yarn dev
服务默认在 http://localhost:5173 启动,浏览器打开就能看到 Vue3 默认欢迎页。
审查 Vue 管理后台的变更请求(Vue 2 + Element UI,Vue 3 + Element Plus)。重点关注最小化变更实现、上线风险检查以及回归检查清单生成。
立即学习“前端免费学习笔记(深入)”;
关键文件速览
-
src/main.js:Vue 应用入口,调用createApp(App).mount('#app') -
src/App.vue:根组件,已含 Composition API 示例 -
index.html:唯一 HTML 入口,内含<div id="app"></div>挂载点 -
vite.config.js:可选配置文件,多数场景无需修改 -
package.json中的dev脚本已预设好开发服务器启动逻辑
不需要额外配置,开箱即用,热更新响应快,改动代码保存后页面几乎实时刷新。

















