目录

微信小程序分包操作指南

微信小程序分包操作指南

什么是分包?

在构建小程序的分包项目时候,构建会输出一个或者多个功能的分包。其中每个分包小程序必定会包含一个主包,所谓主包,就是放置默认的启动页面/tabbar页面,以及一些所有分包都需要用到的公共资源/JS脚本,而分包则是根据开发者的配置进行划分。

什么是分包加载

以上进行分包之后,用户在使用的时候按需进行加载,成为分包加载。

为什么要分包加载

对小程序进行分包,可以优化小程序的首次启动的下载时间,以及在多团队共同开发的时候可以更好的解耦操作。

怎么使用?

假设文件目录结构如下:

├── app.js

├── app.json

├── app.wxss

├── packageA

│ └── pages

│ ├── cat

│ └── dog

├── packageB

│ └── pages

│ ├── apple

│ └── banana

├── pages

│ ├── index

│ └── logs

└── utils

我们可以通过app.json中的subPackages字段中声明项目分包结构:

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

打包原则

  • 声明了subPackages后,将按subPackages配置的路劲进行打包,subPackages配置的 路径之外的目录将被打包到app(主包)中
  • app(主包)也可以有自己的pages(最外层的 pages)
  • subPackage 的根目录不能是另外一个 subPackage 内的子目录
  • 首页的 TAB 页面必须在 app(主包)内

引用原则

https://i-blog.csdnimg.cn/blog_migrate/ec20702620be0b5453f43b874fcad48e.png

也就是当前packageA都不能使用packageB的JS文件、template以及资源