小程序 使用分包【一】

1.分包介绍

分包加载有点类似 Vue 中的按需加载的功能，将小程序拆分成若干个部分叫做分包

1. 在分包的基础上能够实现按需加载当前所需部分小程序代码，在一定程序能够提升小程序的加载速度

2. 同时也能解决小程序代码包大小不能超过 2M 的限制

2.使用分包

分包从形式上来看就是将某些功能相关的页面及其依赖的资源放到独立的文件夹中，然后在 app.json 文件通过 subPackages节点 配置要加载的分包：

{
   "pages":[...],
            
            
+  "subPackages": [

    {
+      "root": "分包根目录",
+      "name": "分包别名，分包预下载时可以使用",
+      "pages": [
        // 分包页面路径，相对于分包根目录
           "pages/goods/goods",
           "pages/goods2/goods2",
+      ]
    },

    {
+      "root": "分包根目录2",
+      "name": "分包别名2，分包预下载时可以使用",
+      "pages": [
        // 分包页面路径，相对于分包根目录
           "pages/goods/goods",
           "pages/goods2/goods2",
+      ]
    }

  ]


}

注意： 使用分包后从主包中跳转到分包页面，路径需要写完整地址 带上 /root

分包中的 / 指向的是当前分包下,image标签选择路径多次使用，后续使用需要相对路径

分包下的静态资源(图片、文件)，不会占用主包空间

3.打包原则

• 声明 subpackages 后，将按 subpackages 配置路径进行打包，subpackages 配置路径外的目录将被打包到主包中

• 主包也可以有自己的 pages，即最外层的 pages 字段。

• subpackage 的根目录不能是另外一个 subpackage 内的子目录

• tabBar 页面必须在主包内

4.总结

1. 分包中的页面只有被访问到时小程序才会去下载相应的代码包

2. 小程序分包对应的是主包，主包就是除了分包以外的代码，tabBar 的页面只能放在主包当中

3. 使用分包也不是对代码体积完全没有限制：

• 整个小程序所有分包大小不超过 20M

• 单个分包/主包大小不能超过 2M