首页移动开发微信小程序大小超限除了分包怎么避免和解决(微信小程序大小上限)

微信小程序大小超限除了分包怎么避免和解决(微信小程序大小上限)

时间2023-03-29 16:41:11发布访客分类移动开发浏览866
导读:这篇“微信小程序大小超限除了分包怎么避免和解决”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“微信小程序大小超限除了分包怎么避...
这篇“微信小程序大小超限除了分包怎么避免和解决”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“微信小程序大小超限除了分包怎么避免和解决”文章吧。

当前微信小程序大小限制以及为什么要限制大小:

1️⃣先看一下当前微信小程序对于大小方面的相关限制:
1.不限制分包的数量;
2.所有分包的大小不能超过20m;
3.单个包的大小不能超过2m;

2️⃣那么为什么微信小程序要对大小做限制?
因为小程序的设计初衷就是用完即走,轻量化应用。不建议将它当成一个app来设计,所以考虑到启动速度等方面所以才对大小做了限制。

避免和解决大小限制有什么办法:

知道了上面的相关限制,那么我们可以从开发的过程去尽量避免我们的小程序大小超过2m(当然是那种商城啥的量级很大的当我没说)

1.使用第三方库尽量按需加载

比如说像在项目里面使用echarts,通常我们用到的可能也有几种图标,所以在安装的时候没必要将echarts全部下载,直接在echarts官网在线定制可以节省不止一星半点的大小(echarts中国地图有问题不推荐使用哦)像我们使用的一些ui库类似,能按需引入就按需引入不能按需引入我们就换一个

在这里推荐一些微信小程序常用的UI库合集

1、官方WeUI组件库

2、ColorUI

3、Vant Weapp UI

4、iView UI

5、TaroUI

2.压缩图片等静态文件

项目中肯定会用到很多的图片,一张图片通常情况下设计会给我们二倍图、三倍图,让我们根据不同的分辨率去展示不同的倍图。其实粗暴的方法我们不管什么分辨率都可以都使用三倍图(不推荐使用哦),然后把图片无损压缩一下,一般能减小图片百分之七十的大小。
3.静态资源放云服务

减少静态资源在打包文件里面占用的体积,还可以把项目里面使用的静态文件放在OSS上面,可以使用CDN加速还可以减少代码大小。
⚠️注意:有时候访问不了是需要配置防盗链,具体怎么配置大佬们自行百度。

4.使用分包

来到我们正统的解决大小限制的方法,先看一下文章刚开头提出的问题:分包除了能解决大小这个问题还有什么好处呐? 要回答这个问题先了解一下分包到底是怎么样工作的:在小程序启动时,默认会下载主包并启动主包内页面,当用户进入分包内某个页面时,客户端会把对应分包下载下来,下载完成后再进行展示。

那么上面的问题就好回答了: 对小程序进行分包,可以优化小程序首次启动的下载时间,以及在多团队共同开发时可以更好的解耦协作。

那么我们要分包应该怎么做?:下面列举了我们常用的原生、uniapp、taro的分包写法,三种开发方式做分包除了配置文件名称是不同的,代码都是一样,关键的是项目目录和subpackages字段。

原生

//在app.json的subpackages字段声明项目分包结构
{

"pages":[			主包
"pages/index",
"pages/logs"
],
"subpackages":[	分包	
{

"root":"packageA",	
"pages":[
"pages/cat",	相对于root分包的路径
"pages/dog"
]
}
,{

"root":"packageB",
"name":"pack2",
"pages":[
"pages/apple",
"pages/banana"
]
}
,
{

root:分包根目录
name:分包别名,分包预下载时可以使用
pages:分包页面路径数组,相对与分包根目录
independent:true|false分包是否是独立分包
}

]
}
    

uniapp

//在pages.json的subpackages字段声明项目分包结构
代码同原生,关键就是subpackages字段

taro

//在src目录下app.jsx中进行配置
代码同原生,关键就是subpackages字段

以上就是关于“微信小程序大小超限除了分包怎么避免和解决”这篇文章的内容,相信大家都有了一定的了解,希望小编分享的内容对大家有帮助,若想了解更多相关的知识内容,请关注行业资讯频道。

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

微信小程序

若转载请注明出处: 微信小程序大小超限除了分包怎么避免和解决(微信小程序大小上限)
本文地址: https://pptw.com/jishu/715.html
Gitlab中如何优雅的拉取和合并代码(gitlab怎么拉取代码) 如何下载别人在Gitee中上传的代码(gitee怎么下载别人的代码)

游客 回复需填写必要信息