一.小程序分包
当我们微信小程序太大的时候,我们上传小程序体验版会失败,因为小程序上传,这个时候我们可以试试分包操作,
每个使用分包小程序必定含有一个主包。所谓的主包,即放置默认启动页面/TabBar 页面,以及一些所有分包都需用到公共资源/JS 脚本;而分包则是根据开发者的配置进行划分。
目前小程序分包大小有以下限制:
- 整个小程序所有分包大小不超过 20M
- 单个分包/主包大小不能超过 2M
二.分包操作
1.我们先来看下官方文档给出的目录结构
├── app.js
├── app.json
├── app.wxss
├── packageA
│ └── pages
│ ├── cat
│ └── dog
├── packageB
│ └── pages
│ ├── apple
│ └── banana
├── pages
│ ├── index
│ └── logs
└── utils
2.基本配置
"mp-weixin": {
"optimization":{"subPackages":true}
}
3.我就以自己的小程序为例
"subPackages": [
{
"root": "pagesA",
"pages": [
{
"path": "center/kefu",
"style": {
"backgroundColor": "#ffffff"
}
},
{
"path": "my/zhaoshang",
"style": {
"backgroundColor": "#ffffff"
}
}
]
},
],
4.分包预加载
做这一步主要为了优化速度,不想优化速度的可以跳过这个配置
配置preloadRule后,在进入小程序某个页面时,由框架自动预下载可能需要的分包,提升进入后续分包页面时的启动速度
preloadRule
中,key
是页面路径,value
是进入此页面的预下载配置,每个配置有以下几项:
字段 | 类型 | 必填 | 默认值 | 说明 |
packages | StringArray | 是 | 无 | 进入页面后预下载分包的 root 或 name 。__APP__ 表示主包。 |
network | String | 否 | wifi | 在指定网络下预下载,可选值为:all(不限网络)、wifi(仅wifi下预下载) |
例子