【详讲】微信小程序分包流程步骤(微信怎么开小)

【详讲】微信小程序分包流程步骤 【详讲】微信小程序分包流程步骤

推荐整理分享【详讲】微信小程序分包流程步骤(微信怎么开小)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:微信小tips,微信小tips,微信的小,微信的小,微信小tips,微信怎么开小,微信小小说,微信小小说,内容如对您有帮助，希望把文章链接给更多的朋友！

本文基于微信小程序的官方文档，对分包的概念以及具体的操作流程进行讲解。

一、为什么要使用分包？

主要原因就是微信小程序规定了主包大小不能超过 2M ，但我们随着开发的更新迭代，一个小程序往往是大于 2M 的。于是小程序提供了分包的解决方法，将一个完整的的小程序，在打包时分成不同功能或需求的分包，在用户使用时再加载对应的分包。

主包：使用分包后必须有一个主包，用于存放 TabBar 页面，以及一些公共的资源文件和JS脚本。

分包：从主包上拆分而来的文件，个人建议的的拆分方式：先根据 TabBar 页面拆分大的模块，再拆分每个 TabBar内具体的小功能模块，这样拆分管理起来也更加清晰明了。

目前小程序分包大小有以下限制：

整个小程序所有分包大小不超过 20M单个分包/主包大小不能超过 2M二、使用分包1、基本配置

我们先看看官方给出的目录结构和 app.josn 的配置：

目录结构

├── app.js├── app.json---------分包配置文件├── app.wxss├── packageA---------分包A│ └── pages│ ├── cat│ └── dog├── packageB---------分包B│ └── pages│ ├── apple│ └── banana├── pages------------主包│ ├── index│ └── logs└── utils

app.json 配置

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

app.json 参数说明：

pages：主包 List ，默认以一个路径为主页，放置 TabBar 的页面，放在根目录下的 pages 文件夹内。

subpackages：分包 List ，官方的分包是默认放在根目录下的，实际上可以根据自身需要配置路径，下文将根据官方的 demo 展示。

字段类型说明rootString分包根目录，默认是从根目录开始nameString分包别名，分包预下载 时可以使用pagesStringArray分包页面路径，相对于分包根目录independentBoolean分包是否是 独立分包2、demo 案例分析

下载 小程序示例（分包加载版）源码

为了看起来更清晰，我删除了部分重复文件，但保留了 demo 本身的目录结构。看 demo 不难看出无论是分包还是主包，都是放在 page 这个文件夹下面的，这说明分包所在位置并没有严格的要求，可以根据自身的需求配置路径放置。

此外我们还需要注意到，主包和分包的默认路径是从根目录开始的，分包的路径是以 root 内的设置的路径为起始。

3、打包原则