uni-app小程序端无“自动编译模式”,其所谓自动编译实为微信开发者工具服务端口开启前提下,cli的dev:mp-weixin命令监听文件变化并实时构建,配合工具端编译模式设置指定启动页实现的组合效果。

uni-app 小程序端没有“自动编译模式”这个内置概念,所谓“自动编译”其实是微信开发者工具的实时监听 + uni-app CLI 构建流程配合的结果。真正能控制的,是编译目标、触发时机和启动页行为——不是开关式“自动”,而是靠配置组合实现接近自动的效果。
微信开发者工具开启服务端口是前提
不打开这个,HBuilderX 或 CLI 都无法把编译结果推送到开发者工具。错误现象是:点击“运行到小程序模拟器”后无反应,或提示“连接失败”。
- 在微信开发者工具右上角 → 设置 → 安全 → 勾选 服务端口
- 关闭并重启开发者工具,否则设置不生效
- 该端口默认为 55001,不可自定义;若被占用,需手动杀进程或换端口(但 uni-app 不支持配端口)
CLI 运行命令决定是否“自动”监听文件变化
npm run dev:mp-weixin 是唯一真正具备热重编译能力的命令,它启动的是 watch 模式;而 npm run build:mp-weixin 只是一次性构建,不会监听。
-
dev:mp-weixin启动后,dist/build/mp-weixin目录会随源码保存实时更新 - 微信开发者工具需已打开并导入该目录(首次需手动导入,后续自动刷新)
- 如果用 HBuilderX 运行,本质也是调用同一套 CLI,但 UI 层做了封装,容易掩盖路径问题
- 注意:某些旧版
@dcloudio/uni-cli在 watch 模式下会漏编译static或components下的文件,建议升级到@dcloudio/uni-cli@3.0.0+
pages.json 里改不了“编译模式”,只能改启动页
很多人搜“自动编译模式”其实是想快速预览某个页面——这跟编译无关,是微信开发者工具的“编译模式”功能,uni-app 本身不参与控制。
- 微信开发者工具右上角 → 编译模式 → 新增 → 填写页面路径(如
pages/category/category) - 该路径必须已在
pages.json的list中注册,否则报错page path is not found - 不能填
pages/category或category.vue,必须带完整路径和文件名(不含扩展名) - 此设置只影响开发者工具本地调试,不影响实际发布包结构
条件编译无法用于切换编译模式,但可控制启动逻辑
你不能靠 #ifdef MP 让 uni-app “这次编译成 category 页,下次编译成 index 页”,但可以在首页动态跳转来模拟效果。
- 在首页
onLoad中加判断:if (process.env.NODE_ENV === 'development' && uni.getSystemInfoSync().platform === 'ios') { uni.navigateTo({ url: '/pages/category/category' }) } - 注意:冷启动时跳转可能有白屏感,建议加
uni.showLoading缓冲 - 不要在
App.vue的onLaunch里跳转,此时路由系统未就绪,uni.navigateTo会静默失败 - 这种跳转方式不影响正式包,只对开发态生效,且需配合微信开发者工具的“编译模式”才能避免双跳
最容易被忽略的一点:微信开发者工具的“编译模式”和 CLI 的 dev:mp-weixin 是两套独立机制。前者只改入口页面展示,后者才真正触发文件监听与重建。混用时若 pages.json 第一页不是你设的编译模式页,冷启动仍会先加载第一页再跳转——这就是白屏或闪屏的根源。











