1.分包的概念
把一个完整的小程序项目,按照需求划分为不同的子包,在构建时打包成不同的分包,用户在使用时按需进行加载。
2.分包的作用
可以优化小程序首次启动的下载时间。
在多人团队开发时可以更好的解耦协作。
3.分包的项目构成
1个主包+多个分包构成。单包2M,总包20M。
主包:启动页面+tabbar页面+公共资源。
分包:分包页面+私有资源。
4.分包的加载规则
小程序启动时,默认会下载主包并启动主包内页面,tabbar页面只能放在主包中。
进入到分包页面后,客户端才会下载分包进行展示
5.配置分包
主要页面 -> pages -> 主包所有页面
分包页面 -> packageA -> pages ->分包所有页面
app.js -> subpackage ->定义分包结构
6.打包原则
subpackag配置分包,subpackage之外的目录将打包到主包。
主包 -> all & !package -> pages -> tabbar + pages/index?
分包 -> package -> all
分包之间不能互相嵌套
7.分包引用原则
主包无法引用分包私有资源
分包之间不能互相引用私有资源
分包可以引用主包公共资源
8.独立分包
概念:本质也是分包,可以独立于主包和其他分包而单独运行。
区别:1.普通分包必须依赖主包才能运行;2.独立分包可以在不下载主包情况下运行。
特点:可以有多个独立分包。
应用场景:具有功能独立性的页面配置到独立分包。不依赖载主包,启动速度快。
配置:subpackage -> "independent": true
引用原则:独立分包不能引用主包公共资源,与主包、分包、其他独立分包相互隔绝。
9.分包预下载
概念:进入小程序某个页面时,由框架自动预下载可能需要的分包,从而提升进入后续分包页面时的启动速度。
配置:app.json
"preloadRule": { // 分包预下载规则
"pages/contact/contact":{ // 触发页面
"packages": ["packageA"], // 分包 root | name
"network": "all" // all | WiFi
}
},
限制:同一个分包页面预下载大小限额2M,主包-> 3page -> 3package < 2m