小程序分包

583 阅读2分钟

小程序分包,就是将小程序划分成不同的子包,在构建时打包成不同的分包,用户在使用时按需进行加载

分包的原因

由于小程序有体积和资源加载限制,并且有时需要优化小程序首次启动的下载时间,所以需要进行小程序分包。

小程序官方说明了分包大小的限制:

  • 整个小程序所有分包大小不超过 20M
  • 单个分包/主包大小不能超过 2M

如何进行分包

在分包时,会有主包和子包之分。

  • 主包:小程序首次启动的时候,默认就会加载的包

    放置默认启动页面或者 TabBar 页面,以及一些所有分包都需用到公共资源/JS 脚本,大文件尽量不要放在在主包中

  • 分包:当操作界面,如果进入的是分包页面,才会下载对应的分包资源后展示

    分包的情况根据开发者的配置进行划分

首先打开源码视图,设置 subpackages 属性为 true:

1682643010474.png

在 app.json 文件中, 外层的 pages 字段存储的是主包的信息,subpackages 字段中声明分包的文件,subpackages 为一个数组,每一条数据声明的是分包的信息,形式如下:

  • name:分包的包名
  • pages:页面的路径
  • root:分包根目录
  • independent:是否独立分包
image.png

另外还需要注意的是:

  • 主包无法引用分包的私有资源,分包可以引用主包内的公共资源
  • 分包之间不能相互引用私有资源

其它具体细节可参考官方: 小程序使用分包

打包之后,可以查看到分包的结果,以及包的大小:

image.png