小程序包大小超過2M的解決方法

小程序的包被限制在2M如下， 超出的時候點擊預覽， 發現報錯：

Error: 代碼包大小爲 3701 kb，上限爲 2048 kb，請刪除文件後重試

1. 優化代碼， 刪除掉不用的代碼

2. 圖片壓縮或上傳服務器

通常圖片所佔空間較大，儘可能不要放在小程序本地文件夾中，若是圖片很少咱們也能夠對圖片進行壓縮，我常常使用的圖片壓縮平臺：點擊這裏；

也能夠將圖片上傳到服務器上，進行外鏈引用， 咱們使用的是阿里雲oss存儲， 另外也能夠經過圖片託管平臺對圖片進行託管， 我找到的的圖片託管平臺：點擊此處；

另外， 經過cli命令建立的uni app項目，可將圖片或字體圖標放入assets文件夾下，經過require引入， 也可減小主包大小

3. 分包加載

官方推出小程序分包加載這一功能，對於萬千小程序開發者來講這無疑是天大的喜訊，關於如何分包，微信官方文檔已經解釋的十分清楚，在進行分包以前建議認真閱讀官方文檔。

接下來簡單介紹一下在不一樣框架中的使用：

在uni app中：

 uni app經過cli初始化的小程序目錄結構以下：

├── src
    ├── main.js
    ├── App.vue
    ├── pages.json
    ├── manifest.json
    ├── orderPackages
    │   └── pages
    │       ├── goodsDetail
    │       └── myorder
    ├── pages
    │   ├── index
    │   └── user
    └── utils

需在pages.json中配置subPackages字段

{ "pages": [ { "path": "pages/index/index", "style": { "navigationBarTitleText": "首頁" } }, { "path": "pages/user/user", "style": { "navigationBarTitleText": "我的中心" } } ], "subPackages": [{ "root": "orderPackages", "pages": [{ "path": "pages/goodsDetail/goodsDetail", "style": { "navigationStyle": "custom" } }, { "path": "pages/myorder/myorder", "style": { "navigationBarTitleText": "個人訂單" } } ] }] }

在頁面中跳轉分包頁面路徑：

uni.navigateTo({ url: `/orderPackages/pages/order/order` })

在taro中：

taro初始化的小程序目錄結構以下：

├── src
    ├── app.js
    ├── app.scss
    ├── index.html
    ├── packageA
    │   └── pages
    │       ├── goodsDetail
    │       └── myorder
    ├── pages
    │   ├── index
    │   └── user
    └── utils

需在app.js中配置subPackages字段

config = {
    pages: [
      'pages/index/index',
      'pages/user/user'
    ],
    subPackages: [
      {
        'root': 'packageA',
        'pages': [
          'pages/goodsDetail/goodsDetail',
          'pages/myorder/myorder'
        ]
      }
    ]
  }

在頁面中跳轉分包頁面路徑：

taro.navigateTo({ url: `/orderPackages/pages/order/order` })

以上只羅列了uni app和taro框架分包加載的步驟， 原生小程序分包方法根據官方文檔便可快速實現，小程序框架雖多， 大都大同小異，若是後續有使用其餘框架進行開發，會進行補充。