2021-09-28-【小程序】小程序开发-环境篇

微信小程序分包

一、为什么要分包？

1. 小程序要求压缩包体积不能大于2M，否则无法编译发布；
2. 在实际项目中，体积大于2M时就需要通过分包机制进行发布上传；
3. 对小程序进行分包，可以优化小程序首次启动的下载时间，因为分包后主包体积小了，有效提高用户体验；
4. 将小程序划分成不同的子包，在构建时打包成不同的分包，用户在使用时按需进行加载，提高了程序性能；

二、使用分包

1、常规分包

通过在 app.json subpackages 字段声明项目分包结构，配置如下：

{
  "pages":[
    "pages/index",
    "pages/logs"
  ],
  "subpackages": [
    {
      "root": "packageA",
      "pages": [
        "pages/cat",
        "pages/dog"
      ]
    }, {
      "root": "packageB",
      "name": "pack2",
      "pages": [
        "pages/apple",
        "pages/banana"
      ]
    }
  ]
}

打包原则

• 声明 subpackages 后，将按 subpackages 配置路径进行打包，subpackages 配置路径外的目录将被打包到 app（主包） 中
• app（主包）也可以有自己的 pages（即最外层的 pages 字段）
• subpackage 的根目录不能是另外一个 subpackage 内的子目录
• tabBar 页面必须在 app（主包）内

引用原则

• packageA 无法 require packageB JS 文件，但可以 require app、自己 package 内的 JS 文件；使用 分包异步化 时不受此条限制
• packageA 无法 import packageB 的 template，但可以 require app、自己 package 内的 template
• packageA 无法使用 packageB 的资源，但可以使用 app、自己 package 内的资源

低版本兼容

由微信后台编译来处理旧版本客户端的兼容，后台会编译两份代码包，一份是分包后代码，另外一份是整包的兼容代码。 新客户端用分包，老客户端还是用的整包，完整包会把各个 subpackage 里面的路径放到 pages 中。

分包步骤

1. 规划分包后，包文件管理，通过工具迁移页面

2. 配置app.json 配置 subpackages

3. 修改页面跳转路径、组件、工具包、静态资源路径是否正确，wx.navigateTo({
4. 通过工具编译，预览检测资源路径是否正确

2、独立分包

独立分包是小程序中一种特殊类型的分包，可以独立于主包和其他分包运行。一个小程序中可以有多个独立分包。常见应用场景为：临时加的广告也或活动页面