微信小程序分包

1.分包的概念

把一个完整的小程序项目，按照需求划分为不同的子包，在构建时打包成不同的分包，用户在使用时按需进行加载。

2.分包的作用

• 可以优化小程序首次启动的下载时间。

• 在多人团队开发时可以更好的解耦协作。

3.分包的项目构成

• 1个主包+多个分包构成。单包2M，总包20M。

• 主包：启动页面+tabbar页面+公共资源。

• 分包：分包页面+私有资源。

4.分包的加载规则

• 小程序启动时，默认会下载主包并启动主包内页面，tabbar页面只能放在主包中。

• 进入到分包页面后，客户端才会下载分包进行展示

5.配置分包

• 主要页面 -> pages -> 主包所有页面

• 分包页面 -> packageA -> pages ->分包所有页面

• app.js -> subpackage ->定义分包结构

6.打包原则

• subpackag配置分包，subpackage之外的目录将打包到主包。

• 主包 -> all & !package -> pages -> tabbar + pages/index?

• 分包 -> package -> all

• 分包之间不能互相嵌套

7.分包引用原则

• 主包无法引用分包私有资源

• 分包之间不能互相引用私有资源

• 分包可以引用主包公共资源

8.独立分包

• 概念：本质也是分包，可以独立于主包和其他分包而单独运行。

• 区别：1.普通分包必须依赖主包才能运行；2.独立分包可以在不下载主包情况下运行。

• 特点：可以有多个独立分包。

• 应用场景：具有功能独立性的页面配置到独立分包。不依赖载主包，启动速度快。

• 配置：subpackage -> "independent": true

• 引用原则：独立分包不能引用主包公共资源，与主包、分包、其他独立分包相互隔绝。

9.分包预下载

• 概念：进入小程序某个页面时，由框架自动预下载可能需要的分包，从而提升进入后续分包页面时的启动速度。

• 配置：app.json

  "preloadRule": { // 分包预下载规则
    "pages/contact/contact":{ // 触发页面
      "packages": ["packageA"], // 分包 root | name
      "network": "all" // all | WiFi
    }
  },

• 限制：同一个分包页面预下载大小限额2M，主包-> 3page -> 3package < 2m