uniapp-微信小程序 分包–詳解

實(shí)際環(huán)境（用business舉例，可以創(chuàng)建很多個(gè)分包）

先說(shuō)好，如果代碼模塊多，就一個(gè)一個(gè)模塊搞（照著做不會(huì)錯(cuò)）

直入主題，我代碼寫完了，一真機(jī)運(yùn)行，g，發(fā)現(xiàn)超過(guò)2m（微信小程序不能超過(guò)2m），找辦法，發(fā)現(xiàn)設(shè)置里面有個(gè)最大運(yùn)行4M，打開(kāi)后可以真機(jī)調(diào)試了，結(jié)果上傳代碼，g，必須小于2M。找辦法

1、將靜態(tài)資源放到服務(wù)器去，拿網(wǎng)絡(luò)圖片不占用項(xiàng)目資源（可行）但靜態(tài)資源只能200k，其中tarbar的圖標(biāo)icon只能是png、jpg等，結(jié)果拿設(shè)計(jì)圖太大了，改，改完之后，整個(gè)主包的靜態(tài)資源也就是static文件夾，小于200k了，但是內(nèi)存還是大了，可能是內(nèi)置了其他的ui庫(kù)的原因，沒(méi)關(guān)系第二個(gè)辦法。

2、使用分包，在這之前沒(méi)用過(guò)，找了好幾篇文章，又沒(méi)說(shuō)清楚。跟我走

????1°分包的概念，把你主頁(yè)也就是小程序tarbar之外的頁(yè)面、資源、組件，放出去，別再主包里面混資源，等待用的時(shí)候再拿過(guò)來(lái)。

????2°主包和分包區(qū)分：主包（pages、static、components）可能還有，其他的不重要了，除去他們其他基本都算分包（意思是你都可以用分包裝起來(lái)）

????3°來(lái)個(gè)實(shí)際場(chǎng)景，跟我走

首先、最開(kāi)始你們沒(méi)想過(guò)分包的話，你所有的模塊都應(yīng)該是頁(yè)面放在pages，靜態(tài)資源放在static、組件放在components里面，此時(shí)pages里面的很多頁(yè)面你們是不用初次進(jìn)入直接使用的，所以分出去?？磮D
原本我的狀態(tài)是：


上面的下面那張圖片是接著上面的，懶得放回去了，意思就是pages下面的business文件夾下有很多vue頁(yè)面，都是頁(yè)面跳轉(zhuǎn)的，初次進(jìn)入index首頁(yè)時(shí)并不會(huì)用到這些文件，所以把它丟出去。此時(shí)我們?cè)趐ages同級(jí)下創(chuàng)建一個(gè)business文件夾。

我們把除了tarbar需要的那幾個(gè)界面的其他界面全都放這個(gè)文件夾里面來(lái)，同時(shí)我們可以創(chuàng)建components文件夾和static文件夾，存放這個(gè)分包business文件夾中所用到的components組件和靜態(tài)資源，但要注意，我們這篇文章是已經(jīng)做好項(xiàng)目了，所以當(dāng)你拉出組件和圖片的時(shí)候，要看一下tarbar的那幾個(gè)頁(yè)面有沒(méi)有用到這些組件和static，如果用到了，你要放到主包里面去的

（其實(shí)最簡(jiǎn)單的就是把全部復(fù)制出來(lái)之后，自己去主包的static和components里面刪除tarbar頁(yè)面不用的那些資源就OK了）

然后就到了配置環(huán)節(jié)，我們?cè)舅械慕缑娑荚趐ages.json文件里面寫好了，現(xiàn)在已business為例，原本path應(yīng)該都是pages/business/… 現(xiàn)在除了tarbar那個(gè)界面，其他的全部復(fù)制一份然后刪除（指business下的）在pages.json的pages同級(jí)下創(chuàng)建一個(gè)

然后把你剛復(fù)制的那些粘貼到subPackages的pages里面，要改名字
舉個(gè)例子：原本pages/business/caichan,放過(guò)來(lái)之后變成：caichan,為什么？這是路徑，自己想（/business/caichan）

照著這個(gè)寫下去就行，嫌麻煩，自己循環(huán)去。到這里pages.json寫完了。
然后跟我走：找這個(gè)

在源碼視圖里面有個(gè)(項(xiàng)目是uniapp做微信小程序，轉(zhuǎn)其他估計(jì)也差不多，但不保證完全一致，自己去翻對(duì)應(yīng)文檔)mp-weixin
在他里面寫屬性：

（非常貼心，直接復(fù)制）

“optimization” : {
“subPackages” : true
},//開(kāi)啟分包
“l(fā)azyCodeLoading” : “requiredComponents” //按需注入

寫完這個(gè)來(lái)到最后一步了——改路徑
之前那些組件引入的時(shí)候不都是…/…/components/…嗎還有/static/這些，你現(xiàn)在business提到了最外面，路徑肯定改了，至于怎么改（用uniapp搜索然后替換是最快的，前提是你之前的代碼都遵循了比較好的規(guī)范），自己想辦法，反正你沒(méi)改過(guò)去，代碼會(huì)報(bào)錯(cuò)（跟著報(bào)錯(cuò)改），如果發(fā)現(xiàn)編譯后頁(yè)面沒(méi)了，路徑也對(duì)了，那多半是還沒(méi)緩過(guò)來(lái)，等等就好，重新編譯。

最后，是否成功分包，可以看得到，編譯后彈出的微信開(kāi)發(fā)者工具中有一個(gè)代碼質(zhì)量

選擇代碼質(zhì)量，讓他掃描一下，下面有一個(gè)

點(diǎn)擊查看就可以看到整個(gè)項(xiàng)目的文件了
看看我的：

劃重點(diǎn)，右邊那個(gè)分包，以這個(gè)為標(biāo)準(zhǔn)，有就對(duì)了。
ok，如果沒(méi)看懂，可以評(píng)論問(wèn)我或私信，有空會(huì)回復(fù)的，如果覺(jué)得講的不好，放上官網(wǎng)鏈接，自己看吧

如果看不懂，還是看我的，挺詳細(xì)的，照著做，不會(huì)錯(cuò)，點(diǎn)這個(gè)就是官網(wǎng)鏈接文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-422236.html

到了這里，關(guān)于uniapp-微信小程序 分包--詳解的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！