uniapp分包的方法在開放文檔裡有,有一定基礎的小夥伴還是可以看懂的
uniapp分包
首先 我們在根目錄下建立一個pagesB檔案夾,用來放置需要分包的頁面
![](https://img.laitimes.com/img/_0nNw4CM6IyYiwiM6ICdiwiIyVGduV2YfNWawNyZuBnLxYDO1AjNzkDM1ITOwAjMwIzLc52YucWbp5GZzNmLn9Gbi1yZtl2Lc9CX6MHc0RHaiojIsJye.png)
下一步是把比較大的檔案直接拉過去,pages裡就沒有這個檔案了,然後配置路由
"subPackages": [{
"root": "pagesB", //檔案夾名稱, pages檔案夾同級建立一個就行
"pages": [
{
"path" : "line_otem_detail/line_otem_detail",
"style" : {
"navigationBarTitleText": "确認訂單"
}
},
]
}],
它和pages裡的路由位址的差距就是沒有字首
兩個包的頁面分開了,想要聯系怎麼辦?
隻需修改路由跳轉的路徑即可 比如pages裡的某個檔案要跳轉到pagesB裡的某個檔案,需要精确查找
下面是分包預加載
就是說進入那個頁面的時候就開始加載某個封包件
"preloadRule": {
"pages/index/index": {
"network": "all",
"packages": ["pagesB"]
}
},
all是不限制網絡,packages是加載的包名
就這麼簡單,分包就完成了
進入微信開發者工具,左上角詳情,基本資訊,本地代碼點開就可以看到了
然後是壓縮
針對vendor.js過大的情況可以使用運作時壓縮代碼
HBuilderX建立的項目勾選運作–>運作到小程式模拟器–>運作時是否壓縮代碼
cli建立的項目可以在pacakge.json中添加參數–minimize,示例:“dev:mp-weixin”: “cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service uni-build --watch --minimize”
壓縮大概可以壓一倍左右,是以我建議先壓縮運作,再分包
本文轉載自: https://blog.csdn.net/weixin_45811884/article/details/108789618