背景:用uniapp开发小程序时会遇到文件夹资源过大(一般是2M以上)导致无法预览的问题,因此就需要配置分包规则;话不多说,直接上代码:
-
先在根目录下面建立几个需要做分包的文件夹,如:
-
打开pages.json这个文件,一般情况会有四个主页面,如:
"pages": [
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "首页"
}
},
{
"path": "pages/clue/clue",
"style": {
"navigationBarTitleText": "线索"
}
},
{
"path": "pages/manage/manage",
"style": {
"navigationBarTitleText": "管理"
}
},
{
"path": "pages/my/my",
"style": {
"navigationBarTitleText": "我的"
}
}
],
- 在pages同级结构中建立名为subPackages的数组对象,例:
"subPackages": [
{
"root": "packageA",
"name": "indexOthers",
"pages": [
{
"path": "xxxx/xxxxxx",
"style": {
"navigationBarTitleText": "模板页面"
}
}
]
},
{
"root": "packageB",
"name": "clueOthers",
"pages": [
{
"path": "xxxx/xxxxxx",
"style": {
"navigationBarTitleText": "模板页面"
}
}
]
},
{
"root": "packageC",
"name": "manageOthers",
"pages": [
{
"path": "xxxx/xxxxxx",
"style": {
"navigationBarTitleText": "模板页面"
}
}
]
},
{
"root": "packageD",
"name": "myOthers",
"pages": [
{
"path": "xxxx/xxxxxx",
"style": {
"navigationBarTitleText": "模板页面"
}
}
]
}
],
其中root字段对应建立的上面的文件夹目录名称;name字段需要自定义一个名字下面规则里面会用到
- 在pages与subPackages的同级结构中再建立一个preloadRule的字段,此为一个对象;里面是设定的分包规则;代码示例如下:
"preloadRule": {
"pages/index/index": {
"network": "all",
"packages": [
"indexOthers"
]
},
"pages/clue/clue": {
"network": "all",
"packages": [
"clueOthers"
]
},
"pages/manage/manage": {
"network": "all",
"packages": [
"manageOthers"
]
},
"pages/my/my": {
"network": "all",
"packages": [
"myOthers"
]
}
},
每一个字段都要一一对应;第一行对应pages里面的path路径;network里面有几个参数,目前我均使用all,代表无论是什么网络情况都直接下载对应包的资源;packages字段里面是对应的在subPackages里面自定的name名称。