由于现在小程序功能越来越多,迭代的小程序代码量越来越多,接近2M,分包在所难免,所以最近就开始把小程序做了分包处理。
分包可以优化小程序首次启动的下载时间,以及在多团队共同开发时可以更好的解耦协作。
- 使用分包
and
分包预加载
├── app.js
├── app.json
├── app.wxss
├── packageA
│ └── pages
│ ├── cat
│ └── dog
├── packageB
│ └── pages
│ ├── apple
│ └── banana
├── pages
│ ├── index
│ └── logs
└── utils
{
"pages":[
"pages/index/index",
"pages/logs/logs"
],
"subPackages": [ //注意这里的`P`是大写
{
"root": "packageA",
"pages": [
"pages/cat/cat",
"pages/dog/dog"
]
}, {
"root": "packageB",
"name": "pack2",
"pages": [
"pages/apple/apple",
"pages/banana/banana"
]
} //注意这里是没有逗号,不然会报错
]
},
"preloadRule": { //分包预加载
"pages/index/index": {
"network": "all",
"packages": ["packageA"]
}
},
- 分包之间的跳转
假如要从pages/index/index
跳转到pages/apple/apple
要怎么跳转呢?
wx.navigateTo({
url: '/packageB/pages/apple/apple',
})
- 引用原则
1、packageA
无法 requirepackageB
JS 文件,但可以 requireapp
、自己 package 内的 JS 文件
2、packageA
无法 importpackageB
的 template,但可以 requireapp
、自己 package 内的 template
3、packageA
无法使用packageB
的资源,但可以使用app
、自己 package 内的资源
总结起来就是:分包之间相互独立,但分包可以使用app
同级的目录资源,比如app.js
同级目录的资源
网友评论