uni-app小程序分包配置必须写在pages.json根级subpackages字段中,与pages、tabbar同级;不可写入manifest.json或vue.config.js,路径需严格匹配大小写且不以/开头或结尾,tabbar页面必须留在主包pages数组内。

pages.json 的 subPackages 必须写在根级,不是 manifest.json
很多人把分包配置塞进 manifest.json 或 vue.config.js,结果构建后主包体积纹丝不动。uni-app 的分包逻辑只在小程序平台由 pages.json 驱动,且 subPackages 必须是它的根级字段,和 pages、tabBar 并列。
常见错误现象:npm run build:mp-weixin 后主包仍超 2MB,微信开发者工具里“分包分析”看不到任何子包。
-
subPackages写在mp-weixin对象内部(如manifest.json中)→ 无效 -
subPackages缩进错位或被包裹在其他对象里 → 构建时直接忽略 - 路径含多余斜杠,如
"root": "subPackages/user/"(结尾有/)→ 分包不识别
subPackages 路径大小写必须与实际目录严格一致
iOS 小程序对路径大小写敏感,subpackages/user 和 subPackages/user 是两个不同路径。Windows 开发者容易忽略这点,本地调试正常,但上传后 iOS 端白屏或跳转失败。
使用场景:你新建了目录 subPackages/order,但在 pages.json 里写成 "root": "subpackages/order" → iOS 上该分包根本不会加载。
- 检查真实文件夹名:用命令行
ls -l或资源管理器确认大小写 - 路径必须以
/开头、不以/结尾,如"root": "/subPackages/order"错误,应为"root": "subPackages/order" - 所有
path字段都相对于root,比如"pages": [{"path": "pages/list"}]对应文件subPackages/order/pages/list.vue
TabBar 页面必须放在 pages 数组,不能进 subPackages
哪怕某个 Tab 页面功能再重、资源再多,只要它出现在 tabBar.list 里,就必须定义在 pages 数组中,否则首次启动就白屏。
错误示例:把 pages/mine/mine.vue 放进 subPackages/user,同时又在 tabBar.list 里引用它 → 微信小程序报错 “page frame error”,iOS 尤其明显。
-
pages数组只放主包页面:首页、分类、购物车、我的(即所有 TabBar 页面) - 分包内可以有自己的
tabBar吗?不行。小程序不支持分包内嵌 TabBar - 如果“我的”页后续要拆出“设置”“帮助”等子页,这些子页可放进分包,但入口页
pages/mine/mine.vue必须留在主包
preloadRule 不生效?检查触发页是否为主包且未加载过
preloadRule 必须和 subPackages 同级,写在某个分包对象内部无效。而且它只对“尚未加载过的分包”起作用——用户已进入过该分包,再访问触发页也不会重复预加载。
典型问题:写了规则却没看到 network 面板出现分包请求。
- 触发页路径必须是主包里的页面,如
"pages/index/index";分包页的onShow不会触发预加载 -
"network": "all"是默认值,但若设为"wifi",4G/5G 下不会发起请求 -
"packages"值填的是分包的root字符串(如"subPackages/order"),不是name字段(即使你写了name)
<image src="..."></image> 引用,就进不了分包。











