一、問題：我們在小程序工具中開發時候，需要本地打包，但是當本地的打包文件大于2M時候，預覽的二維碼就會有問題，導致真機掃碼打不開或者有遺漏。

二、此時就需要開啟分包

1.微信小程序每個分包的大小是2M，總體積一共不能超過20M。 2.開啟分包后，再次編輯打包，預覽的二維碼就可以正常打開小程序了。

三、uni-app官方分包文檔

四、分包注意項

1.微信小程序每個分包的大小是2M，總體積一共不能超過20M。 2.開啟分包后，再次編輯打包，預覽的二維碼就可以正常打開小程序了。 3.開啟分包，必須注意：需要將原來的打包文件unpackage下的dist文件刪除；否則編譯時候，你會發現自己的分包反而越來越大；刪除原來打包的dist后再重新發行打包就行。

五、分包步驟1

1.在pages同級，創建pagesA和pagesB兩個分包；文件夾的名字隨便命名，每分一個包就創建一個文件夾；如下圖 2.需要注意：小程序的首頁和tabBar頁必須放在主包pages內；其他頁面可以放在分包內 3.分包下支持獨立的 static 目錄，用來對靜態資源進行分包。

六、分包步驟2

1.將部分頁面移到分包pagesA或者pagesB下； 2.注意：如果你一開始就分包了，路徑跳轉或者引入應該不會有問題；但是如果你一開始都是在pages下，后來才開始分包， 然后將部分vue頁面移到分包文件夾下，可能路徑跳轉和引入的文件路徑就錯了，就需要手動修改跳轉路徑和引入路徑，方式修改見下圖（說多了都是淚）；。

引入的修改：使用@引入

每個分包下都可以有自己的static，放置圖片路徑跳轉的修改，例如主包pages的下的index頁面，跳轉到了分包pagesB下的get-password頁面：只需要寫上get-password在pagesB的路徑即可：

uni.navigateTo({url:"/pagesB/get-password?obj= " +encodeURIComponent(JSON.stringify(obj)),});

七、分包步驟3

1.更改pages.json配置：如下圖。

1.1pages主包：不需要動，只需要方主包頁面

1.2subPackages：分包加載配置，subPackages 節點接收一個數組，數組每一項都是應用的子包；subPackages 里的pages的路徑是 root 下的相對路徑，不是全路徑。

例如我的就是放了pagesA和pagesB，一定要注意root的是寫分包名稱，不需要 /；path寫對應的頁面路徑

"subPackages": [{"root": "pagesA","pages": [{"path": "add-car","style": {"navigationBarTitleText": "新增車輛"}},{"path": "car-info","style": {"navigationBarTitleText": "詳情車輛"}},]},{"root": "pagesB","pages": [{"path": "get-password","style": {"navigationBarTitleText": "找回密碼"}}]}],

1.3preloadRule：分包預載配置

"preloadRule": {"pagesA/add-car": {"network": "all","packages": ["__APP__"]},"pagesA/car-info": {"network": "all","packages": ["__APP__"]},"pagesB/get-password": {"network": "all","packages": ["pagesB"]}}, 2.開啟分包后，再次編輯打包，預覽的二維碼就可以正常打開小程序了。

八、分包步驟4

1.點擊左側列表manifest.json–>源碼視圖，找到npm-wexin，開啟分包優化 //開啟分包優化"optimization" : {"subPackages" : true}

九、分包步驟5

1.壓縮代碼

十、分包步驟6

1.刪除原有的打包文件。

2.重新發行打包。

3.分包前后的效果對比：存在主包和分包，體積也相應變化減小，預覽也可以了。

分包前:

分包后：

有用就點個贊吧！

總結

以上是生活随笔為你收集整理的uni-app小程序本地打包超过2M不能预览问题；小程序打包过大不能预览和真机调试；uni-app分包；的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。