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


Posted in Javascript onMarch 23, 2020

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

官方文档: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

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

到此这篇关于小程序使用分包的示例代码的文章就介绍到这了,更多相关小程序使用分包内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
jquery 1.3.2 IE8中的一点点的小问题解决方法
Jul 10 Javascript
jQuery 学习入门篇附实例代码
Mar 16 Javascript
基于jQuery的message插件实现右下角弹出消息框
Jan 11 Javascript
c#程序员对TypeScript的认识过程
Jun 19 Javascript
JavaScript中的ajax功能的概念和示例详解
Oct 17 Javascript
JS实现倒计时(天数、时、分、秒)
Nov 16 Javascript
AngularJS折叠菜单实现方法示例
May 18 Javascript
关于Ajax的原理以及代码封装详解
Sep 08 Javascript
详解使用React进行组件库开发
Feb 06 Javascript
video.js 一个页面同时播放多个视频的实例代码
Nov 27 Javascript
vue多次循环操作示例
Feb 08 Javascript
解决vue-router路由拦截造成死循环问题
Aug 05 Javascript
用JS实现选项卡
Mar 23 #Javascript
vscode 配置vue+vetur+eslint+prettier自动格式化功能
Mar 23 #Javascript
云服务器部署Node.js项目的方法步骤(小白系列)
Mar 23 #Javascript
vue ssr+koa2构建服务端渲染的示例代码
Mar 23 #Javascript
详解webpack-dev-middleware 源码解读
Mar 23 #Javascript
vscode调试node.js的实现方法
Mar 22 #Javascript
如何优雅地取消 JavaScript 异步任务
Mar 22 #Javascript
You might like
咖啡的传说和历史
2021/03/03 新手入门
PHP 程序授权验证开发思路
2009/07/09 PHP
THINKPHP+JS实现缩放图片式截图的实现
2010/03/07 PHP
探讨Hessian在PHP中的使用分析
2013/06/13 PHP
php注册系统和使用Xajax即时验证用户名是否被占用
2017/08/31 PHP
如何直接访问php实例对象中的private属性详解
2017/10/12 PHP
PHP二维数组实现去除重复项的方法【保留各个键值】
2017/12/21 PHP
详谈PHP中public,private,protected,abstract等关键字的用法
2017/12/31 PHP
javascript qq右下角滑出窗口 sheyMsg
2010/03/21 Javascript
js Form.elements[i]的使用实例
2011/11/13 Javascript
jquery 实现表单验证功能代码(简洁)
2012/07/03 Javascript
js函数返回多个返回值的示例代码
2013/11/05 Javascript
JavaScript中获取Radio被选中的值
2015/11/11 Javascript
Javascript 创建类并动态添加属性及方法的简单实现
2016/10/20 Javascript
详解如何将angular-ui的图片轮播组件封装成一个指令
2017/05/09 Javascript
javascript删除数组元素的七个方法示例
2019/09/09 Javascript
简单了解微信小程序 e.target与e.currentTarget的不同
2019/09/27 Javascript
Python实现图片拼接的代码
2018/07/02 Python
浅谈python中真正关闭socket的方法
2018/12/18 Python
python dict 相同key 合并value的实例
2019/01/21 Python
如何基于pythonnet调用halcon脚本
2020/01/20 Python
Windows下Anaconda和PyCharm的安装与使用详解
2020/04/23 Python
使用Python防止SQL注入攻击的实现示例
2020/05/21 Python
css图标制作教程制作云图标
2014/01/19 HTML / CSS
html5唤起app的方法
2017/11/30 HTML / CSS
FC-Moto英国:欧洲最大的摩托车服装和头盔商店之一
2019/08/25 全球购物
岗位廉洁从政承诺书
2014/03/27 职场文书
优秀语文教师事迹
2014/05/18 职场文书
网上祭先烈心得体会
2014/09/01 职场文书
个人授权委托书范本
2014/09/14 职场文书
2014年人事专员工作总结
2014/11/19 职场文书
公司员工安全协议书
2014/11/21 职场文书
运动会运动员赞词
2015/07/22 职场文书
小学六一儿童节活动开幕词
2016/03/04 职场文书
导游词之广州陈家祠
2019/10/21 职场文书
SQL SERVER中常用日期函数的具体使用
2021/04/08 SQL Server