CRMEB标准版社交电商演示 CRMEB 标准版
CRMEB Pro高性能私域管理电商系统演示 CRMEB Pro版
CRMEB多店连锁加盟电商管理系统 CRMEB 多店版
多商户 PHP版
多商户 Java版
CRMEB Java开源商城系统 CRMEB Java版
CRMEB 开源外贸版电商系统 CRMEB 外贸版
CRMEB知识付费系统 知识付费
陀螺匠
产品 演示网址 账号 密码

CRMEB客服

CRMEB咨询热线 咨询热线

400-8888-794

CRMEB微信扫码咨询

微信扫码咨询

微信扫码咨询

应用市场 应用市场 CRMEB开源商城下载 源码下载 CRMEB帮助文档 帮助文档
返回顶部 返回顶部
CRMEB客服
CRMEB论坛
小程序包大小超过2M的解决方法
2022-08-18
119584

微信限制了小程序的代码包不能超过2MB,这主要是出于对小程序启动速度的考虑。但是,2MB 的大小也限制了小程序功能的扩展,如果大小超出了2MB该如何解决呢?

1. 优化代码,删除掉不用的代码

2. 图片压缩或者上传服务器
一般图片所占用的空间比较大,尽量不要放在小程序本地文件夹中,如果图片不多的话可以对图片进行压缩,图片压缩平台:https://tinyjpg.com/
另外, 通过cli命令创建的uni app项目,可将图片或字体图标放入assets文件夹下,通过require引入, 也可减少主包大。

3. 分包加载:

什么是分包加载:

小程序一般都是由某几个功能组成,通常这几个功能之间是独立的,但会依赖一些公共的逻辑,且这些功能一般会对应某几个独立的页面。那么小程序代码的打包,可以按照功能的划分,拆分成几个分包,当需要用到某个功能时,才加载这个功能对应的分包。

      对于用户来说,小程序加载流程变成了:

1.首次启动时,先下载小程序主包,显示主包内的页面;

2.进入某个分包的页面,再下载这个对应分包,下载完毕后,显示分包的页面。

采用分包加载,对开发者而言,能使小程序有更大的代码体积,承载更多的功能与服务;而对用户而言,可以更快地打开小程序,同时在不影响启动速度前提下使用更多功能

分包的划分

   在配置前,按照功能对各个分包的内容进行划分,将同一个功能下的页面和逻辑放在童改一个目录下,把一些跨功能的公共逻辑放在主包下。

在分包划分时需注意

1.包与包之间功能尽可能独立,避免分包与分包之间引用上的耦合。因为分包的加载是由用户操作触发的,并不能确保某分包加载时,另外一个分包就一定存在,这个时候可能会导致 JS 逻辑异常的情况,例如报「"xxx.js" is not defined」这样的错误;

2.一些公共的自定义组件,要放在主包内。

分包的配置

uni app中通过cli初始化的小程序目录结构如下:

├── src

    ├── main.js

    ├── App.vue

    ├── pages.json

    ├── manifest.json

    ├── orderPackages

    │   └── pages

    │       ├── goodsDetail

    │       └── myorder

    ├── pages

    │   ├── index

    │   └── user

    └── utils

需在pages.json中配置subPackages字段,在subPackage里面声明项目的分包结构:

目前小程序分包大小的限制:

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

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

以上只罗列了uni app框架分包加载的步骤, 原生小程序分包方法根据官方文档即可快速实现,小程序框架虽多, 大都大同小异,如果后续有使用其他框架进行开发,会进行补充。

如果您想拥有自己的小程序商城系统,可选择CRMEB,CRMEB专注于移动互联网软件设计、研发、销售为一体的高新技术企业,我们将竭诚为您服务。

微信登录/注册

切换手机号登录

{{ bind_phone ? '绑定手机' : '手机登录'}}

{{codeText}}
切换微信登录/注册
暂不绑定
添加官方客服微信
CRMEB公众号二维码

联系客服 领取源码+接口文档🎁