限制在2M以内。如果超过2M,可以通过分包加载实现,在app.json中配置即可,

小程序划分成不同的子包,在构建时打包成不同的分包,用户在使用时按需进行加载。

在构建小程序分包项目时,构建会输出一个或多个分包。每个使用分包小程序必定含有一个主包。所谓的主包,即放置默认启动页面/TabBar 页面,以及一些所有分包都需用到公共资源/JS 脚本;而分包则是根据开发者的配置进行划分。

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

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

整个小程序所有分包大小不超过 8M

单个分包/主包大小不能超过 2M

对小程序进行分包,可以优化小程序首次启动的下载时间,以及在多团队共同开发时可以更好的解耦协作。

{

"pages":[

"pages/index",

"pages/logs"

],

"subpackages": [

{

"root": "packageA",

"pages": [

"pages/cat",

"pages/dog"

]

}, {

"root": "packageB",

"name": "pack2",

"pages": [

"pages/apple",

"pages/banana"

]

}

]

}

打包原则

声明 subpackages 后,将按 subpackages 配置路径进行打包,subpackages 配置路径外的目录将被打包到 app(主包) 中

app(主包)也可以有自己的 pages(即最外层的 pages 字段)

subpackage 的根目录不能是另外一个 subpackage 内的子目录

tabBar 页面必须在 app(主包)内

引用原则

packageA 无法 require packageB JS 文件,但可以 require app、自己 package 内的 JS 文件

packageA 无法 import packageB 的 template,但可以 require app、自己 package 内的 template

packageA 无法使用 packageB 的资源,但可以使用 app、自己 package 内的资源

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

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

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

使用独立分包时要注意:

独立分包中不能依赖主包和其他分包中的内容,包括js文件、template、wxss、自定义组件、插件等。主包中的app.wxss对独立分包无效,应避免在独立分包页面中使用 app.wxss 中的样式;

App 只能在主包内定义,独立分包中不能定义 App,会造成无法预期的行为;

独立分包中暂时不支持使用插件。

关于 getApp()

与普通分包不同,独立分包运行时,App 并不一定被注册,因此 getApp() 也不一定可以获得 App 对象:

当用户从独立分包页面启动小程序时,主包不存在,App也不存在,此时调用 getApp() 获取到的是 undefined。 当用户进入普通分包或主包内页面时,主包才会被下载,App 才会被注册。

当用户是从普通分包或主包内页面跳转到独立分包页面时,主包已经存在,此时调用 getApp() 可以获取到真正的 App。

由于这一限制,开发者无法通过 App 对象实现独立分包和小程序其他部分的全局变量共享。

为了在独立分包中满足这一需求,基础库 2.2.4 版本开始 getApp支持 [allowDefault]参数,在 App 未定义时返回一个默认实现。当主包加载,App 被注册时,默认实现中定义的属性会被覆盖合并到真正的 App 中。

当从独立分包启动小程序时,主包中 App 的 onLaunch 和首次 onShow 会在从独立分包页面首次进入主包或其他普通分包页面时调用。

预下载分包行为在进入某个页面时触发,通过在 app.json 增加 preloadRule 配置来控制。

{

"pages": ["pages/index"],

"subpackages": [

{

"root": "important",

"pages": ["index"],

},

{

"root": "sub1",

"pages": ["index"],

},

{

"name": "hello",

"root": "path/to",

"pages": ["index"]

},

{

"root": "sub3",

"pages": ["index"]

},

{

"root": "indep",

"pages": ["index"],

"independent": true

}

],

"preloadRule": {

"pages/index": {

"network": "all",

"packages": ["important"]

},

"sub1/index": {

"packages": ["hello", "sub3"]

},

"sub3/index": {

"packages": ["path/to"]

},

"indep/index": {

"packages": ["__APP__"]

}

}

}

限制

同一个分包中的页面享有共同的预下载大小限额 2M,限额会在工具中打包时校验。

如,页面 A 和 B 都在同一个分包中,A 中预下载总大小 0.5M 的分包,B中最多只能预下载总大小 1.5M 的分包。

原文:https://www.cnblogs.com/wen-/p/12109247.html

微信小程序 自动解决分包大小问题_微信小程序-分包 -每包2M相关推荐

  1. 微信小程序 自动解决分包大小问题_微信小程序分包加载设置

    设置分包加载 微信小程序分包限制为: 主包或者单个分包最大为2M 整体小程序所有包最大为8M 为什么需要设置分包? 小程序项目中,有多种角色(公共页面很少),设置分包加载方便管理 整个小程序压缩后代码 ...

  2. 微信小程序 自动解决分包大小问题_2020微信小程序前端面试题汇总

    [持续更新,欢迎补充] 1.文件类型 WXML--模板文件 JSON--配置/设置文件,如标题,tabbar,页面注册 WXSS--样式文件,样式可直接用import导入 JS--脚本逻辑文件,逻辑处 ...

  3. 微信小程序 自动解决分包大小问题_一个小小的优化,能让你的小程序瘦身10%...

    我司一直专注于微信小程序(以下简称小程序)开发,可以说是重仓押注在小程序上.但由于小程序的大小有严格的限制(单个分包/主包大小不能超过2M).而我们的业务又相对比较复杂,因此常常会突破小程序的大小限制 ...

  4. 小程序---wxParse解决图片大小不适应小程序页面问题

    有时候使用wxParse渲染html的图文信息时,图片会按照原图的大小显示,在小程序页面就容易出现滚动条,这样页面一点都不美观. 解决办法: 进入wxParse.js文件: 一. var recal ...

  5. 微信小程序上传图片到服务器总是失败_微信小程序上传图片过大导致请求失败的解决方法...

    很多时候我们都会碰到小程序上传图片时因为图片过大而导致请求失败,同时出现各种各样的问题,那么今天来给大家写一个微信小程序上传图片过大导致请求失败的完美解决办法. 以云开发小程序图片检测为例,如果图片过 ...

  6. 微信小程序销毁某一注册函数_微信小程序注销手册

    微信小程序一直存在一个问题:开发者不能注销自己的小程序. 之前当开发者需要彻底清除小程序信息时,只能够通过暂停服务或关闭"允许被搜索"的方式曲线救国.现在,这个问题终于解决了. 在 ...

  7. 损失37亿!Intel将彻底退出傲腾存储业务;车主因眼睛小被自动驾驶误判“开车睡觉”;微信安装包11年膨胀575倍 | EA周报...

    EA周报 2022年7月29日 每个星期7分钟,元宝带你喝一杯IT人的浓缩咖啡,了解天下事.掌握IT核心技术. 周报看点 1.微软联合 Google 甲骨文挑战亚马逊 AWS 在政府云中的地位 2.损 ...

  8. 小程序内嵌h5页面分享_微信小程序webview内页面分享

    因为项目原因,之前在微信小程序内部使用 webview 嵌套了 h5 页面,现在要添加一个新的功能,用户在哪个页面进行了分享,被分享的用户从链接进来就跳转到哪个分享页面. 先了解一下 web-view ...

  9. 微信小程序 界面从右边滑出_微信小程序--左滑右滑的乐趣

    左滑 右滑 你不再是一个人 无论你是一个程序猿还是一个程序媛,每天干的事除了coding还是coding,代码不能解决的问题(什么问题自己心里还没点abcd数嘛),探探能帮你解决.最近网上特流行一款交 ...

最新文章

  1. [基础]iOS 可视化编程(全系列)
  2. 分支和循环_月隐学python第5课
  3. hihocoder 1689 - 推断大小关系(图论+二分)
  4. .Net Core3.0 配置Configuration
  5. d3设置line长度_万物皆可Embedding之LINE算法解读
  6. Android前端音视频数据接入GB28181平台意义
  7. layui如何隐藏弹出层关闭的按钮
  8. python自动化常用数字_Python全栈自动化系列之Python编程基础(基本数据类型)
  9. ORB-SLAM2双目开源框架 (1)
  10. STC学习:导航按键与数字按键综合控制数码管
  11. 查找所引用的文献在某种期刊下的引用格式(引用风格)
  12. asc 点阵数组和计算认识
  13. java优先级 六级和七级_百度知道六级和七级得区别是什么?如何升到七级?
  14. arcgis矢量文件计算多个同类属性面积总和
  15. 商业智能在医疗卫生领域的应用
  16. Linux学习1-Vmware创建虚拟机以及Xshell连接
  17. 使用google.zxing制作条形码和二维码
  18. 计算机cmos参数的设置,设置CMOS参数让电脑从光驱启动
  19. python同切圆_Python绘制同切圆和同心圆
  20. 简历模板,简历通用模板,程序员求职简历模板

热门文章

  1. Excel 上传数据和导出数据
  2. 基础操作案例:ArcGIS PRO基础教程(二)
  3. 阿里云 vs Azure-安全
  4. Android 12.0系统默认设置屏幕永不息屏
  5. 通达信接口官网与量化交易有联系吗?
  6. 使用交易API将产品添加到您的eBay商店
  7. XTUOJ-1271-color
  8. English trip 自习内容 句子结构和成分
  9. textarea中的换行如何展示在页面
  10. echarts的x轴自动动态刷新