应使用 npm create uni-app@latest 创建项目,因其自动适配 Vue 2/Vue 3/TypeScript、基于 Vite 构建、支持 uni_modules 结构,而旧版 vue-cli-plugin-uni 已停更且不兼容 Vue 3+Vite。

直接用 npm create uni-app@latest,别碰旧版 vue-cli-plugin-uni 或全局安装的 uni-app CLI —— 那些要么已废弃,要么生成过时模板,踩坑率极高。
为什么不用 vue create 加插件?
旧教程常教先 vue create 再加 vue-cli-plugin-uni,但该插件自 2022 年起停止维护,不支持 Vue 3 + Vite 构建,且无法生成 uni_modules 目录结构。实际运行时会报 Cannot find module 'uni-app' or its corresponding type declarations 这类路径错误。
- 新版 uni-app 默认基于 Vite,构建速度和 HMR 响应快得多
-
create uni-app自动识别项目类型(Vue 2 / Vue 3 / TypeScript),不用手动选错 - 生成的
project.config.json和vue.config.js(如需)已适配当前 HBuilderX 和 CLI 最新行为
npm create uni-app@latest 执行时的关键选择
运行命令后会进交互式向导,重点注意三项:
-
Project name:别用中文或空格,否则后续在微信开发者工具里导入失败 -
Choose a framework:选Vue 3 (Vite)(除非团队强依赖 Vue 2 生态) -
Choose a preset:新手直接选Default (recommended);若需跨端原生能力(如蓝牙、定位),选App (nvue),它会额外生成native-page.vue和pages.json中的nvueStyle配置
完成后目录里一定有 src/pages/index/index.vue 和 unpackage/(编译输出目标),缺任一说明初始化没走完。
初始化后立刻要改的两个配置点
刚生成的项目默认是 H5 端优先,但多数人真正要的是小程序或 App 调试。必须马上检查:
- 打开
manifest.json,确认name和appid字段已填——微信小程序要求appid必须与后台一致,否则真机调试白屏 - 修改
vue.config.js(如无则新建):加入configureWebpack: { devtool: 'source-map' },否则在微信开发者工具里断点调试时看不到原始.vue文件
如果跳过这两步,会出现「代码写了但真机不生效」「console.log 有输出但断点全灰」这类典型配置缺失问题。
最常被忽略的是:create uni-app 生成的模板默认不包含云开发 SDK 初始化逻辑,要用 uniCloud 就得自己在 main.js 里调 uniCloud.init(),而且必须在 createSSRApp 或 createApp 之后、app.mount() 之前执行。


















