小程序使用分包的示例代码

站长资源 2024/12/27 佚名

80 1538 80

DDR爱好者之家 Design By 杰米

本文介绍了小程序使用分包的示例代码，分享给大家，具体如下：

官方文档：https://developers.weixin.qq.com/miniprogram/dev/framework/subpackages.html

某些情况下，开发者需要将小程序划分成不同的子包，在构建时打包成不同的分包，用户在使用时按需进行加载。

总结就是小程序内所有代码图片资源大小超过2M,此时就可以考虑创建分包，扩大小程序容量

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

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

在小程序启动时，默认会下载主包并启动主包内页面，当用户进入分包内某个页面时，客户端会把对应分包下载下来，下载完成后再进行展示。

注意：TabBar所对应的页面和一些公共的方法和资源必须放在主包，在主包页面调用分包的组件或者方法都是不顶用的

使用分包

开发者通过在 app.jsonsubpackages字段声明项目分包结构：

{

"pages": [

"pages/index/index",

"pages/logs/logs"

],

"subpackages": [

{

"root": "packageA",

"pages": [

"pages/index/index",

"pages/user/user"

]

},

{

"root": "packageB",

"pages": [

"pages/index/index",

"pages/mall/mall"

]

}

],

"preloadRule": {

"pages/index/index": {

"network": "all",

"packages": [

"packageA"

]

}

},

"window": {

"backgroundTextStyle": "light",

"navigationBarBackgroundColor": "#fff",

"navigationBarTitleText": "WeChat",

"navigationBarTextStyle": "black"

},

"style": "v2",

"sitemapLocation": "sitemap.json"

}

引用原则

packageA无法 requirepackageBJS 文件，但可以 requireapp、自己 package 内的 JS 文件
packageA无法 importpackageB的 template，但可以 requireapp、自己 package 内的 template
packageA无法使用packageB的资源，但可以使用app、自己 package 内的资源

总结：分包之间的资源和代码不能相互引用，且主包不能调用分包的资源

分包预下载

开发者可以通过配置，在进入小程序某个页面时，由框架自动预下载可能需要的分包，提升进入后续分包页面时的启动速度。对于独立分包，也可以预下载主包。

分包预下载目前只支持通过配置方式使用，暂不支持通过调用API完成

preloadRule的 key是页面路径，全路径

独立分包

独立分包是小程序中一种特殊类型的分包，可以独立于主包和其他分包运行。从独立分包中页面进入小程序时，不需要下载主包。当用户进入普通分包或主包内页面时，主包才会被下载。

开发者可以按需将某些具有一定功能独立性的页面配置到独立分包中。当小程序从普通的分包页面启动时，需要首先下载主包；而独立分包不依赖主包即可运行，可以很大程度上提升分包页面的启动速度。

一个小程序中可以有多个独立分包。

官方文档在这儿：https://developers.weixin.qq.com/miniprogram/dev/framework/subpackages/independent.html

目前还没用过独立分包。对于到底在什么情境下运用还不是很清楚

小程序使用分包,小程序,分包

DDR爱好者之家 Design By 杰米

广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！

DDR爱好者之家 Design By 杰米

评论“小程序使用分包的示例代码”

暂无评论...

小程序使用分包的示例代码

Vue+elementUI实现多图片上传与回显功能（含回显后继续上传或删除）

用JS实现选项卡

评论“小程序使用分包的示例代码”

更新日志

友情链接