微信小程序分包加载代码实现方式

直接在 “app.json” 中贴入代码

{
  "pages": [
    "pages/Login/xxxx",
  ],
  "subpackages":[{              // 这里就是贴入的代码 root值可以任意改   pages同上
    "root":"packageA",
    "pages":[
      "pages/Login/bbb",
      "pages/Login/ccc",
    ]
  }],
  "window": {
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "WeChat",
    "navigationBarTextStyle": "black"
  },

  

注意几点:

  1. 不要引用同级分包的内容包括js,wxss

  2. tabBar不能分包

  3. 每个分包/主包不要超过2M

下面是分包后的效果查看

原文地址:https://www.cnblogs.com/banyuege/p/11563450.html

时间: 2024-11-06 23:28:47

微信小程序分包加载代码实现方式的相关文章

微信小程序分包加载

分包加载 某些情况下,开发者需要将小程序划分成不同的子包,在构建时打包成不同的分包,用户在使用时按需进行加载. 在构建小程序分包项目时,构建会输出一个或多个功能的分包,其中每个分包小程序必定含有一个主包,所谓的主包,即放置默认启动页面/TabBar 页面,以及一些所有分包都需用到公共资源/JS 脚本,而分包则是根据开发者的配置进行划分. 在小程序启动时,默认会下载主包并启动主包内页面,如果用户需要打开分包内某个页面,客户端会把对应分包下载下来,下载完成后再进行展示. 目前小程序分包大小有以下限制

微信小程序之加载更多(分页加载)实例

业务需求: 列表滚动到底部时,继续往上拉,加载更多内容 必备参数: (1)pageindex: 1 //第几次加载 (2)callbackcount: 15 //需要返回数据的个数 其他参数: 根据接口的所需参数 实现原理: 当第一次访问接口时,传递2个必备参数(第1次加载,需要返回数据的个数为15个),和其他参数(需要搜索的字符串)给后台,后台返回第一次数据过来.在请求成功的的回调函数中,判断返回的数据是否>0,是,则取出数据,渲染视图层,并把"上拉加载"显示在列表底部:否,则

微信小程序预加载图片以及占位图片

wxml页面 利用三目运算:代码如下: 1 <image src="{{ima?ima:'../../images/4.jpg'}}" /> (../../images/4.jpg)这里意思是预加载图片大概是一张黑白色的类似于 js代码如下: Page({ /** * 页面的初始数据 */ data: { ima: "", }, /** * 生命周期函数--监听页面加载 */ internet:function(){ setTimeout(functio

微信小程序之----加载中提示框loading

loading loading只有一个属性hidden .wxml <view> <loading hidden="{{hidden}}"> 加载中... </loading> <button bindtap="changeHidden">show/hidden</button> </view> .js Page({ data:{ hidden:true }, changeHidden: fun

微信小程序 动态加载class

<view class=' {{topid==1?"top": "untop"}}' > 原文地址:https://www.cnblogs.com/zsczsc/p/10177441.html

「小程序JAVA实战」 小程序默认加载的页面和生命周期(八)

转自:https://idig8.com/2018/08/09/xiaochengxu-chuji-08/ 小程序如何加载的呢?生命周期!源码:https://github.com/limingios/wxProgram.git 中的No.3 加载页面 小程序默认加载的pages中的第一个目录 不管你的名称,只管你的顺序 其他目录需要通过触发才能加载 生命周期 相关的框架的时候都有生命周期的概念,通过了解生命周期更好的把控框架的使用! onLaunch 第一次打开小程序的初始化,也被调用一次.

微信小程序「官方示例代码」剖析【下】:运行机制

在上一篇<微信小程序「官方示例代码」浅析[上]>中,我们只是简单的罗列了一下代码,这一篇,让我们来玩点刺激的--就是看看IDE的代码,了解它是怎么运行的. 还好微信的开发团队在软件工程的实践还有待提高,我们才有机会可以深入了解他们的代码--真想建议他们看看Growth的第二部分,构建系统. 解压应用 首先你需要有下面的工具啦 Mac电脑 微信web开发者工具.app WebStorm / 其他编程器 或 IDE,最好可以支持重命名 首先,我们需要右键微信web开发者工具.app,然后显示包的内

微信小程序怎么上传代码

很多企业商家做了微信小程序,都想自己独立的去操作后台,但大多企业商家都没有相关的技术人员,就上传代码都成了问题,以下微信小程序观察网请添加链接描述就和大家分享一下微信小程序怎么上传代码,希望对您有帮助! 第一步:登录微信公众号后台进行小程序基本信息设置操作第二步:设置小程序基本信息,包括名称.头像.介绍以及服务范围.第三步:填写完成之后,再打开你的微信小程序开发工具,点击上传功能,点击上传提示窗口中输入版本号和说明即可.第四步:上传完成之后,返回到微信公众号后台,点击[开发管理].第五步:拉到底

微信小程序-分包 -每包2M

限制在2M以内.如果超过2M,可以通过分包加载实现,在app.json中配置即可, 小程序划分成不同的子包,在构建时打包成不同的分包,用户在使用时按需进行加载. 在构建小程序分包项目时,构建会输出一个或多个分包.每个使用分包小程序必定含有一个主包.所谓的主包,即放置默认启动页面/TabBar 页面,以及一些所有分包都需用到公共资源/JS 脚本:而分包则是根据开发者的配置进行划分. 在小程序启动时,默认会下载主包并启动主包内页面,当用户进入分包内某个页面时,客户端会把对应分包下载下来,下载完成后再