注意事项
某些情况下,开发者需要将小程序划分成不同的子包,在构建时打包成不同的分包,用户在使用时按需进行加载。 在构建小程序分包项目时,构建会输出一个或多个分包。
每个使用分包小程序必定含有一个主包。所谓的主包,即放置默认启动页面/TabBar 页面,以及一些所有分包都需用到公共资源/JS 脚本;而分包则是根据开发者的配置进行划分。
在小程序启动时,默认会下载主包并启动主包内页面,当用户进入分包内某个页面时,客户端会把对应分包下载下来,下载完成后再进行展示。官方文档
独立分包是小程序中一种特殊类型的分包,可以独立于主包和其他分包运行。从独立分包中页面进入小程序时,不需要下载主包。当用户进入普通分包或主包内页面时,主包才会被下载
分包大小限制
- 整个小程序所有分包大小不超过30M(服务商代开发的小程序不超过 20M)。
- 单个分包/主包大小不能超过2M。
打包原则
- tabbar页面必须在主包中。
- 主包也可以有自己的pages,即最外层的pages目录。
- 按subPackages配置路径进行打包,配置路径外的目录将被打包到主包中。
- 分包之间不能相互嵌套,subPackages的根目录不能是另外一个subPackages内的子目录
引用原则
- 主包不可以引用分包的资源,但是分包可以使用主包的公共资源。
- 分包与分包之间资源无法相互引用,分包异步化时不受此限制。
- 独立分包不能使用主包和分包内的资源。app.wxss对独立分包无效。App只能在主包中定义。
使用分包和独立分包
app.json
内配置subPackages
使用分包(数组形式,可配置多个分包)。subPackages
内分包配置项independent: true
开启独立分包。
subPackages
配置项
root
:分包根目录。name
:分包名称,分包预下载时可以使用。pages
:分包页面路径,相对于分包根目录。数组形式,同一个分包内可以配置多个页面。independent
:是否开启独立分包。
"subPackages": [
{
"root": "packageA",
"name": "list",
"pages": [
"list/list",
"test/test"
]
},
{
"root": "packageB",
"name": "userB",
"pages": [
"userB/userB"
],
"independent": true
}
]
分包预下载
开发者可以通过配置,在进入小程序某个页面时,由框架自动预下载可能需要的分包,提升进入后续分包页面时的启动速度。对于独立分包,也可以预下载主包。分包预下载目前只支持通过配置方式使用,暂不支持通过调用API完成。
app.json
内使用preloadRule
配置分包预下载。preloadRule
中,key
是页面路径,value
是进入此页面的预下载配置。
preloadRule
内value
的配置项
packages
:进入页面后预下载分包的root根目录或name名称,__APP__
表示主包。network
:在指定网络下预下载。all
不限网络,wifi
仅wifi(默认值)。
"preloadRule": {
"pages/index": {
"network": "all",
"packages": ["important"]
},
"sub1/index": {
"packages": ["hello", "sub3"]
},
"sub3/index": {
"packages": ["path/to"]
},
"indep/index": {
"packages": ["__APP__"]
}
}