微信小程序小结(4) -- 分包加载及小程序间跳转
分包加载
某些情况下,开发者需要将小程序划分成不同的子包,在构建时打包成不同的分包,用户在使用时按需进行加载(主要是空间不够用,哈哈~)。
在构建小程序分包项目时,构建会输出一个或多个功能的分包,其中每个分包小程序必定含有一个主包,所谓的主包,即放置默认启动页面/TabBar 页面,以及一些所有分包都需用到公共资源/JS 脚本,而分包则是根据开发者的配置进行划分。
在小程序启动时,默认会下载主包并启动主包内页面,如果用户需要打开分包内某个页面,客户端会把对应分包下载下来,下载完成后再进行展示。
目前小程序分包大小有以下限制:
整个小程序所有分包大小不超过 8M
单个分包/主包大小不能超过 2M
使用如下:
{
"pages":[ //主包
"pages/index",
"pages/logs"
],
"subPackages": [ //分包的集合
{
"root": "pages/task/", //分包1:物理根目录
"pages": [
"index/index", //pages/task/index/index
"grade/grade"
]
}, { //分包2
"root": "pages/read/",
"pages": [
"index/index",
"note/note",
"comment/index" //导航全路径:/pages/read/comment/index
]
}
]
}
打包原则
声明 subPackages 后,将按 subPackages 配置路径进行打包,subPackages 配置路径外的目录将被打包到 app(主包) 中。
app(主包)也可以有自己的 pages(即最外层的 pages 字段)。
subPackage 的根目录不能是另外一个 subPackage 内的子目录。
首页的 TAB 页面必须在 app(主包)内。
引用原则
packageA 无法 require packageB JS 文件,但可以 require app、自己 package 内的 JS 文件。
packageA 无法 import packageB 的 template,但可以 require app、自己 package 内的 template。
packageA 无法使用 packageB 的资源,但可以使用 app、自己 package 内的资源。
注意:
- 不管分包如何处理,跳转路径和之前一样正常跳转,一点都没变;加载分包时会有弹窗提示。
- 如果分包的首页在TAB中,则文件必须不能放在分包的目录下;
- 尽管做了分包处理,项目的素材,公共文件等若放在最外层依然会被分在主包中。可将图片等放在分包的目录下。
参考文档:https://developers.weixin.qq.com/miniprogram/dev/framework/subpackages.html
跳转到同个公众号下的另一个小程序
<navigator target="miniProgram" open-type="navigate"
app-id="xxxxxxxx" path="/pages/homework/index/index"
extra-data="" version="release">
打开绑定的小程序
</navigator>
当target="miniProgram"时有效,要打开的小程序版本,有效值 develop(开发版),trial(体验版),release(正式版),仅在当前小程序为开发版或体验版时此参数有效;
如果当前小程序是正式版,则打开的小程序必定是正式版。
UI效果:如打开一个新的小程序一样,有开始的加载效果;之后直接到指定页面(未指定时默认到首页),中间没有别的反应。
点击右上角的关闭按钮,只关闭当前小程序(即跳转到的),之后显示原来的小程序。
微信小程序小结(4) -- 分包加载及小程序间跳转的更多相关文章
- 微信小程序分包加载实战
"离线包"机制 微信小程序采用的是类似离线包加载方案,以转转小程序为例,当用户第一次打开时会先下载好所有代码,然后再加载页面:当用户再次进入转转小程序时,会直接使用已下载的代码,省 ...
- uni-app开发经验分享十四:小程序超过2M限制的方法——分包加载
起初小程序上线时,微信限制了代码包不能超过1MB,后来功能变大变成了2M了,限制大小是出于对小程序启动速度的考虑,希望用户在使用任何一款小程序时,都能获得一种"秒开"体验.但是 ...
- 微信小程序 - 分包加载
小程序开发大家都知道,对主包的大小进行了限制,从最初的1M变成了现再的2M,一般情况下是够用了:但是偶尔可能会出现超出2M的可能,我们可以对小程序进行分包加载. 1.小程序分包加载 a. 某些情况下, ...
- 微信小程序分包加载
分包加载 某些情况下,开发者需要将小程序划分成不同的子包,在构建时打包成不同的分包,用户在使用时按需进行加载. 在构建小程序分包项目时,构建会输出一个或多个功能的分包,其中每个分包小程序必定含有一个主 ...
- 微信小程序---》分包加载
[小程序]---分包加载 一.分包加载 某些情况下,开发者需要将小程序划分成不同的子包,在构建时打包成不同的分包,用户在使用时按需进行加载 在构建小程序分包项目时,构建会输出一个或多个分包.每个使 ...
- mpvue支持小程序的分包加载
目录 clone mpvue-quickstart 模板 分包体验 现有项目的分包改造 这个功能可以说是让我们这些用 mpvue 的等的很焦灼,眼看着项目的大小一天天地逼近 2M,mpvue 还不能很 ...
- 微信小游戏 4M升8M分包加载
一.微信分包加载 微信分包加载教程 嘛,因为原来的4M太小了,满足不了小游戏内容的需求,现在提升到了8M.这8M可以分包加载,而不需要一次性加载8M. 如果是老版本,则分包加载不起作用,会一次加载8M ...
- 微信小程序开发动感十足的加载动画--都在这里!
代码地址如下:http://www.demodashi.com/demo/14242.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...
- 【已解决】wepy中使用分包加载报错
问题: "xxx.js 出现脚本错误后者未正确调用Page()" 最近看小程序启动时间(性能监控),启动时间比较长,所以考虑使用分包加载. 但在使用过程中遇 ...
随机推荐
- ORA-28547:connection to server failed, probable Oracle Net admin error错误,解决方法
当用navicat连接oralce数据库时报ORA-28547错误时,直接懵逼了,上网查了资料说是navicat自带的oci.dll文件的版本和服务器端的oralce数据库的版本不一致造成的. 修改O ...
- 机器学习:SVM(非线性数据分类:SVM中使用多项式特征和核函数SVC)
一.基础理解 数据:线性数据.非线性数据: 线性数据:线性相关.非线性相关:(非线性相关的数据不一定是非线性数据) 1)SVM 解决非线性数据分类的方法 方法一: 多项式思维:扩充原本的数据,制造新的 ...
- 机器学习:线性回归法(Linear Regression)
# 注:使用线性回归算法的前提是,假设数据存在线性关系,如果最后求得的准确度R < 0,则说明很可能数据间不存在任何线性关系(也可能是算法中间出现错误),此时就要检查算法或者考虑使用其它算法: ...
- Swing编程练习。可能这篇会有错误哦
总结:21岁的思思是华为的初级女java工程师,我等女流怎么办呢? Swing.图形用户界面的编程,panel起了很大作用 package com.da; import java.awt.Color; ...
- 部署和调优 2.2 squid反向代理
配置反向代理 打开配置文件 vim /etc/squid/squid.conf 修改 http_port 改为 http_port 80 accel vhost vport 在它下面添加一段 cach ...
- java判断一个字符串中是否包含全角
public static boolean isAngle(String str){ if(str.getBytes().length==str.length()){ //全是半角 return tr ...
- spring-初始化bean
@EnableScheduling@Servicepublic class BaseTask implements InitializingBean, ApplicationContextAware{ ...
- Acviticy.this 和 getApplicationContext()的区别
用AlertDialog 举例 AlertDialog对象是依赖于一个View的,而View是和一个Activity对应的,在Activity销毁的时候它也就销毁了,不会再存在.Activity.th ...
- oracle 之sys 、system区别
角色 1)最重要的区别,存储的数据的重要性不同sys--所有oracle的数据字典的基表和视图都存放在sys用户中,这些基表和视图对于oracle的运行是至关重要的,由数据库自己维护,任何用户都不能手 ...
- Android常用开源库集合【持续更新】
1.FastJson 阿里巴巴工程师做的一个方便的JSON转换库 2.ButterKnife 只要作用能代替代码中大量的findviewbyid语句的使用,使用@injectview注入方式 3.v ...