小程序包大小超過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框架分包加載的步驟， 原生小程序分包方法根據官方文檔即可快速實現，小程序框架雖多， 大都大同小異，如果后續有使用其他框架進行開發，會進行補充。