先参考下面3篇文章
1、分包
https://uniapp.dcloud.io/collocation/pages?id=subpackages
2、预加载
https://uniapp.dcloud.io/collocation/pages?id=preloadrule
3、分包优化
https://uniapp.dcloud.io/collocation/manifest?id=%E5%85%B3%E4%BA%8E%E5%88%86%E5%8C%85%E4%BC%98%E5%8C%96%E7%9A%84%E8%AF%B4%E6%98%8E
打包原则
普通页面分包(按tabbar进行分包)
注意事项:
tabbar 应用的页面需要在主包
如果有登录注册页面要在主包
被多个tabbar引用的组件或是页面要写到主包
静态文件分包
在分包路径下新建static文件夹
将需要引用的文件放入
在页面引用/分包名/static/文件名
: 分包基本逻辑
静态文件:分包下支持 static 等静态资源拷贝,即分包目录内放置的静态资源不会被打包到主包中,也不可在主包中使用
js文件:当某个 js 仅被一个分包引用时,该 js 会被打包到该分包内,否则仍打到主包(即被主包引用,或被超过 1 个分包引用)
自定义组件:若某个自定义组件仅被一个分包引用时,且未放入到分包内,编译时会输出提示信息
下面进行分包
pages.json配置
"subPackages": [
{
"root":"pages/views",
"pages": [
{
"path": "goods/goodsDetails",
"style" : {
"navigationStyle" : "custom",
"navigationBarTitleText" : "商品详情"
}
},
{
"path": "goods/goodsEvaluate",
"style" : {
"navigationBarTitleText" : "所有评价",
"navigationBarBackgroundColor":"#F8F8F8",
"app-plus" : {
"bounce":"none"
}
}
},
{
"path": "home/classList",
"style" : {
"navigationBarTitleText" : "商品列表",
"navigationStyle" : "custom",
"app-plus" : {
"titleNView" : false,
"bounce":"none"
}
}
},
{
"path": "home/search",
"style" : {
"navigationBarTitleText" : "搜索",
"navigationBarBackgroundColor":"#F8F8F8"
}
},
{
"path": "home/h5map",
"style" : {
"navigationBarTitleText" : "选择位置",
"navigationBarBackgroundColor":"#F8F8F8"
}
},
{
"path": "order/evaluate/evaluate",
"style" : {
"navigationBarTitleText" : "商品评价",
"navigationBarBackgroundColor":"#F8F8F8"
}
},
{
"path": "order/location/location",
"style" : {
"navigationBarTitleText" : "编辑取件地址",
"navigationBarBackgroundColor":"#F8F8F8"
}
},
{
"path": "order/afterSale",
"style" : {
"navigationBarTitleText" : "申请售后",
"navigationBarBackgroundColor":"#F8F8F8"
}
},
{
"path": "order/afterSaleDetails",
"style" : {
"navigationBarTitleText" : "服务单详情",
"navigationBarBackgroundColor":"#F8F8F8"
}
},
{
"path": "order/afterSaleList",
"style" : {
"navigationBarTitleText" : "退换/售后",
"navigationStyle" : "custom",
"app-plus" : {
"titleNView" : false,
"bounce":"none"
}
}
},
{
"path": "order/afterType",
"style" : {
"navigationBarTitleText" : "选择售后类型",
"navigationBarBackgroundColor":"#F8F8F8"
}
},
{
"path": "order/cancelOrder",
"style" : {
"navigationBarTitleText" : "申请退款",
"navigationBarBackgroundColor":"#F8F8F8"
}
},
{
"path": "order/confirmOrder",
"style" : {
"navigationBarTitleText" : "确认订单",
"navigationBarBackgroundColor":"#F8F8F8"
}
},
{
"path": "order/orderDetails",
"style" : {
"navigationBarTitleText" : "订单详情",
"navigationBarBackgroundColor":"#F8F8F8"
}
},
{
"path": "order/orderList",
"style" : {
"navigationBarTitleText" : "我的订单",
"navigationStyle" : "custom",
"app-plus" : {
"titleNView" : false,
"bounce":"none"
}
}
},
{
"path": "order/success",
"style" : {
"navigationBarTitleText" : "支付结果",
"navigationStyle" : "custom",
"app-plus" : {
"titleNView" : false
}
}
},
{
"path": "order/stepDetails",
"style" : {
"navigationBarTitleText" : "进度详情",
"navigationBarBackgroundColor":"#F8F8F8"
}
},
{
"path": "poster/poster"
},
{
"path": "setting/index",
"style" : {
"navigationBarTitleText" : "设置"
}
},
{
"path": "user/address/edit",
"style" : {
"navigationBarTitleText" : "编辑收货地址",
"navigationBarBackgroundColor":"#F8F8F8"
}
},
{
"path": "user/exchange/exchange",
"style" : {
"navigationBarTitleText" : "兑换礼品",
"navigationBarBackgroundColor":"#F8F8F8"
}
},
{
"path": "user/allFootprint",
"style" : {
"navigationBarTitleText" : "我的足迹",
"navigationStyle" : "custom",
"app-plus" : {
"titleNView" : false,
"bounce":"none"
}
}
},
{
"path": "user/extension",
"style" : {
"navigationBarTitleText" : "推广海报",
"navigationBarBackgroundColor":"#F8F8F8"
}
},
{
"path": "user/myaddress",
"style" : {
"navigationBarTitleText" : "收货地址",
"navigationBarBackgroundColor":"#F8F8F8",
"app-plus" : {
"bounce":"none"
}
}
},
{
"path": "user/mycollection",
"style" : {
"navigationBarTitleText" : "我的收藏",
"navigationStyle" : "custom",
"app-plus" : {
"titleNView" : false,
"bounce":"none"
}
}
},
{
"path": "user/mycoupon",
"style" : {
"navigationBarTitleText" : "优惠券",
"navigationBarBackgroundColor":"#F8F8F8",
"app-plus" : {
"bounce":"none"
}
}
},
{
"path": "user/mydistribution",
"style" : {
"navigationBarTitleText" : "分销中心",
"navigationBarTextStyle" : "white"
}
},
{
"path": "user/mypoints",
"style" : {
"navigationBarTitleText" : "我的积分",
"navigationBarTextStyle" : "white",
"app-plus" : {
"bounce":"none"
}
}
},
{
"path": "user/mysubordinate",
"style" : {
"navigationBarTitleText" : "我的下级",
"navigationBarBackgroundColor":"#F8F8F8",
"app-plus" : {
"bounce":"none"
}
}
},
{
"path": "withdrawal/withdrawal",
"style" : {
"navigationBarTitleText" : "提现",
"navigationBarBackgroundColor":"#F8F8F8"
}
},
{
"path": "withdrawal/withdrawalrecord",
"style" : {
"navigationBarTitleText" : "提现明细",
"navigationBarBackgroundColor":"#F8F8F8",
"app-plus" : {
"bounce":"none"
}
}
},
{
"path": "withdrawal/withdrawalrecord",
"style" : {
"navigationBarTitleText" : "提现明细",
"navigationBarBackgroundColor":"#F8F8F8",
"app-plus" : {
"bounce":"none"
}
}
}
]
}
],
"preloadRule": {
"pages/tabBar/tabBar/home": {
"network": "all",
"packages": ["__APP__"]
}
}
mainfest.json 中的配置
开启分包
其实我配成功也还不太理解,主要错误会出现在:
这个root 是包名,又是路径,成功后的微信是这样的
这里对于static资源分包还没学会,后续补充完善,刚学会一点点
详细这里:
https://copyfuture.com/blogs-details/20201128151522074lqjqh6asz92cv6c