分包
1.分包
分包是指将一个完整的小程序项目根据需求划分成不同的子包,然后将其构建成不同的子包,用户在使用时可以按需加载。
每个使用子包小程序必须包含一个主包。所谓主包就是放置默认的启动页面/TabBar页面 小程序商城定制开发 ,所有子包都需要一些公共资源/JS脚本;
对小程序进行分包
分包 分包前,将小程序项目中的所有页面和资源打包在一起小程序软件开发,使得整个项目过大,影响小程序首次启动的下载时间。
分包后小程序项目由1个主包+多个分包组成:
小程序启动时,默认会下载主包,并启动主包中的页面。当用户在分包中进入页面时,客户端会下载对应的分包,下载完成后显示。
目前小程序分包大小有以下限制:
2.使用分包
假设支持分包的小程序目录结构如下:
├── app.js
├── app.json
├── app.wxss
├── packageA
│ └── pages
│ ├── cat
│ └── dog
├── packageB
│ └── pages
│ ├── apple
│ └── banana
├── pages
│ ├── index
│ └── logs
└── utils
开发者在 app.json 子包字段中声明项目子包结构:
{
"pages":[
"pages/index",
"pages/logs"
],
"subpackages": [
{
"root": "packageA",
"pages": [
"pages/cat/cat",
"pages/dog/dog"
]
}, {
"root": "packageB",
"name": "pack2",
"pages": [
"pages/apple/apple",
"pages/banana/banana"
]
}
]
}
包装原理:
引用原则:
3.独立分包
独立分包是一种特殊类型的小程序子包可以独立于主包和其他子包运行。从独立子包中的页面进入小程序时 小程序开发商城 ,无需下载主包。主包只有在用户进入普通分包或主包页面时才会下载。
开发者可以根据需要将某些功能独立的页面配置成独立的子包。小程序从普通分包页面启动时小程序软件开发,需要先下载主包;并且独立的子包可以在不依赖主包的情况下运行,可以大大提高子包页面的启动速度。一个小程序可以有多个独立的子包
在子包中,每个子包的配置有以下几项:
字段类型说明
根
字符串
分包根目录
名字
字符串
分包别名,分包预下载
页面
字符串数组
子包页面路径,相对于子包根目录
独立
布尔值
分包是否为独立分包
├── app.js
├── app.json
├── app.wxss
├── moduleA
│ └── pages
│ ├── rabbit
│ └── squirrel
├── moduleB
│ └── pages
│ ├── pear
│ └── pineapple
├── pages
│ ├── index
│ └── logs
└── utils
开发者通过app.json的subpackages字段中对应的子包,包配置项中定义的独立字段声明对应的子包为独立子包。
{
"pages": [
"pages/index",
"pages/logs"
],
"subpackages": [
{
"root": "moduleA",
"pages": [
"pages/rabbit/rabbit",
"pages/squirrel/squirrel"
]
}, {
"root": "moduleB",
"pages": [
"pages/pear/pear",
"pages/pineapple/pineapple"
],
"independent": true
}
]
}
引用原则:
4.分包预下载
开发者可以配置,进入小程序的某个页面时,框架会自动预下载可能需要的子包小程序软件开发,提高后续进入子包页面时的启动速度。
对于独立的子包,也可以预先下载主包。
进入指定页面会触发预下载分包的行为。在 app.json 中,使用 preloadRule 节点定义子包的预下载规则。示例代码如下:
注意:__APP__ 代表主包。
"indep/index": {
"packages": ["__APP__"]
}
限制:同一子包中的页面共享一个共同的预下载大小限制为2M,该限制将在工具中打包时进行验证。比如A页面和B页面在同一个子包中,总大小0.5M的子包可以预下载,总大小1.5M的子包只能预下载- 最多在B下载
本站声明: 本文章内容来源于互联网,文章内容仅供用户参考。本公司不能完全保证文章内容的准备性、时效性。如果因本文章对用户造成了任何损失或者损害,本公司将不会承担任何法律责任。如果涉及到版权问题,请提交到wikins@nbyuyuan.com