uni-app 微信小程序分包优化
一、分包介绍
-
subPackages里的pages的路径是root下的相对路径，不是全路径。 - 微信小程序每个分包的大小是2M，总体积一共不能超过20M。所以需要分包管理你的文件 。
- 主包：放置默认启动页面/TabBar 页面，以及一些所有分包都需用到公共资源/JS 脚本；
- 分包：是根据pages.json的配置进行划分。
- 在小程序启动时，默认会下载主包并启动主包内页面，当用户进入分包内某个页面时，会把对应分包自动下载下来，下载完成后再进行展示。
- 分包下支持独立的
static目录，用来对静态资源进行分包。 - 针对
vendor.js过大的情况可以使用运行时压缩代码-
HBuilderX创建的项目勾选运行-->运行到小程序模拟器-->运行时是否压缩代码 -
cli创建的项目可以在package.json中添加参数--minimize，示例："dev:mp-weixin": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service uni-build --watch --minimize"
-
二、使用方法：
假设支持分包的 uni-app 目录结构如下：
┌─pages
│ ├─index
│ │ └─index.vue
│ └─login
│ └─login.vue
├─pagesA
│ ├─static
│ └─list
│ └─list.vue
├─pagesB
│ ├─static
│ └─detail
│ └─detail.vue
├─static
├─main.js
├─App.vue
├─manifest.json
└─pages.json
则需要在 pages.json 中填写
{ "pages": [{ "path": "pages/index/index", "style": { ...} }, { "path": "pages/login/login", "style": { ...} }], "subPackages": [{ "root": "pagesA", "pages": [{ "path": "list/list", "style": { ...} }] }, { "root": "pagesB", "pages": [{ "path": "detail/detail", "style": { ...} }] }], "preloadRule": { "pagesA/list/list": { "network": "all", "packages": ["__APP__"] }, "pagesB/detail/detail": { "network": "all", "packages": ["pagesA"] } } }
uni-app 微信小程序分包优化
原文：https://www.cnblogs.com/zjianfei/p/14863762.html