uni-app如何分包：

微信官方要求小程序單包不能超過2M/主包，整包不能超8M，如果我們不做分包處理是無法正常上傳到微信平臺(tái)的，所以這里我針對(duì)做了以下分包。

1.頁面分包：

分包加載配置，此配置為小程序的分包加載機(jī)制。在App里始終為整包。

我用的開發(fā)工具是vsCode,所以按照最后面的方案配置，找到根目錄下的package.json文件，在build:mp-weixin 添加"–minimize"參數(shù)，如下圖：

然后找到根目錄下的pages.json配置你的分包，如下圖：

切記一條，如果你的項(xiàng)目是要實(shí)現(xiàn)tabBar底部導(dǎo)航的，tab的頁面一定要放在pages下面，不能放分包下面去注冊

到這里就完成了頁面的分包操作

2.圖片分包

如果我們圖片放在根目錄的static下面的話，打包的時(shí)候是直接打包到我們的主包下面，這樣主包的負(fù)荷就會(huì)非常大，我們項(xiàng)目相對(duì)大一點(diǎn)的時(shí)候，圖片也是非常占據(jù)資源的，所以這里也做一個(gè)分包處理。

先創(chuàng)建一個(gè)圖片文件夾，命名按需求，圖片下面的分包圖片必須和你分包的頁面名稱一致，如下圖：

接下來配置圖片的打包設(shè)置，先在根目錄下創(chuàng)建一個(gè)vue.config.js文件，如下圖：

附上vue.config.js內(nèi)容：

const path = require('path')

const CopyWebpackPlugin = require('copy-webpack-plugin')

module.exports = {

? configureWebpack: {

? ? plugins: [

? ? ? new CopyWebpackPlugin([

? ? ? ? {

? ? ? ? ? from: path.join(__dirname, '/src/images'),

? ? ? ? ? to: path.join(__dirname + '/dist/', process.env.NODE_ENV === 'production' ? 'build' :? ? ? ? ? ? ? ? ? ? 'dev', process.env.UNI_PLATFORM, '/')

? ? ? ? }

? ? ? ])

? ? ]

? }

}

接下來在控制臺(tái)輸入?npm install copy-webpack-plugin添加插件到自己的項(xiàng)目下。

如果你用的不是vsCode,就根據(jù)箭頭的位置修改你對(duì)應(yīng)的文件目錄路徑。

接下來我們可以在開發(fā)工具上查看到，圖片已經(jīng)打包到分包下了，圖片分包就搞定了。

補(bǔ)充一下，如果通用的圖片，建議直接放根目錄的static下調(diào)用

如不明白，需要源碼可以聯(lián)系筆者，不足之處，還望指教