uni-app 之使用分包——起源于微信错误码——800051

军哥哥傻乎乎 發表於 2021-9-15 19:41:00

uni-app 之使用分包——起源于微信错误码——800051

<h1>故事起源</h1>
最近一直在用uni-app开发微信小程序。良久没有真机调试和发布。一步小心，居然发现它错了。
message：Error: 系统错误，错误码：80051,source size 2169KB exceed max limit 2MB 
 原来小程序有体积和资源加载限制。在微信小程序中，每个包不能超过2M,总计不能超过20M。好吧，原来，叫小程序真的有原因的。2169K > 2M。话说，这里的2M是2048K还是2000K ?
然后，我顺着思路用了两种方法，这里就不详细叙述了。方法一，压缩公共资源。结果，还是太大了。第二步，把图片转换为网络的，小程序里只是引用。然而……
<img src="https://img2020.cnblogs.com/blog/1602649/202109/1602649-20210915160518143-1497314598.png">
 所以，我的项目中，公共资源似乎并不多。
这两个是不成熟的方法，不能更大程度上的解决问题。本来处在临界状态，一直会战战兢兢、如履薄冰。这个方法，月光族月末时的勤俭节约。可以，月光族节俭一段时间后，会空间充裕，而小程序包却不能。还好，有另一条路——分包。
<h1> 解决方法：分包</h1>
假设支持分包的目录结构如下：
<div class="cnblogs_code">
<pre>┌─pages
│├─index
││└─index.vue
│└─login
│ └─login.vue
├─pagesA
│├─static
│└─list
│ └─list.vue
├─pagesB
│├─static
│└─detail
│ └─detail.vue
├─static
├─main.js
├─App.vue
├─manifest.json
└─pages.json
</pre>
</div>
则需要在pack.json中填写：
<div class="cnblogs_code">
<pre>{
"pages": [{
 "path": "pages/index/index",
 "style": { ...}
}, {
 "path": "pages/login/login",
 "style": { ...}
}],
" subPackages ": [{
 "root": "pagesA",
 "pages": [{
 "path": "list/list",
 "style": { ...}
 }]
}, {
 "root": "pagesB",
 "pages": [{
 "path": "detail/detail",
 "style": { ...}
 }]
}],
"preloadRule": {
 "pagesA/list/list": {
 "network": "all",
 "packages": ["__APP__"]
 },
 "pagesB/detail/detail": {
 "network": "all",
 "packages": ["pagesA"]
 }
}
}</pre>
</div>
这里的 subPackages 表示分包加载配置，此配置为小程序的分包机制，
 preloadRule 表示分包预配置，配置preloadRule后，在进入小程序某个页面时，由框架自动预下载可能需要的分包，提升进入后续分包页面时的启动速度。
嗯，这个方法可用。不过，我知道的太晚，有好多页面地方要改路径——枯了！看来，我的代码有待优化。
关于pages.json的配置可以查看官网的说明，当然，我也誊写了官网的说明。
<h1> 参考网址</h1>
<ul>
<li id="articleContentId" class="title-article">uniapp如何分包 & 分包配置后无法读取static文件夹: https://blog.csdn.net/m0_46442996/article/details/116207284</li>
<li>subPackages :https://uniapp.dcloud.io/collocation/pages?id=subpackages</li>
</ul>

</div>
<div id="MySignature" role="contentinfo">
有志者，事竟成，破釜沉舟，百二秦关终属楚；苦心人，天不负，卧薪尝胆，三千越甲可吞吴。 
来源：https://www.cnblogs.com/luyj00436/p/15272097.html

頁: [1]

琼殿技术论坛's Archiver

uni-app 之使用分包——起源于微信错误码——800051