解决uniapp上传小程序体积过大的问题

 更新时间:2023年09月25日 10:49:11   作者:stark张宇  
在昨天的工作中遇到了一个微信小程序上传代码过大的情况,在这里总结一下具体的解决步骤,首先介绍一下,技术栈是使用uniapp框架+HBuilderX的开发环境,需要的朋友可以参考下

概述

在昨天的工作中遇到了一个微信小程序上传代码过大的情况,在这里总结一下具体的解决步骤,首先介绍一下,技术栈是使用uniapp框架+HBuilderX的开发环境。

错误提示

真机调试,提示包提交过大,不能正常生成二维码,后续上传代码更是不可能了,减少包中的体积顺着这条思路去解决问题。

1.静态图片资源改变成网络请求的方式

我们使用的初衷是,把图片加载在static本地,缓存在本地,以便提升更快的响应速度,第一步剥离大的图片更换成网络请求,顺着编辑器提示去处理。

2.对小程序进行分包

小程序主包最大可以加载到1.5M,加载所有的依赖和插件不能大于2M,小程序中有个解决办法是对小程序进行分包处理,使每个包保持在2M的大小,主包和分包之间直接进行跳转,分包和分包不能跳转。

"optimization" : {
    "subPackages" : true
},

进行了拆包还是没有解决问题,分包的作用主要运行的是代码,也就是说代码要尽量的小,多了需要进行分解。

3.压缩vendor.js

昨天真正的定位问题是vendor.js 1.88M ,小程序开发代码工具-详情-代码依赖分析中查看,解决vendor.js才是根本的解决之道。

使用HBuilderX打包上传来解决问题,HBuilderX -> 发行 -> 小程序(微信),操作的过程失败了一次,是因为需要注意的是需要绑定开发者后台的地方,开发管理->开发设置->小程序代码上传下载小程序代码上传密钥和绑定IP白名单,这个需要管理员同意。

最后包的体积从12.88M压缩到了4.16M,问题得以解决。

到此这篇关于uniapp解决上传小程序体积过大的问题的文章就介绍到这了,更多相关uniapp上传小程序体积过大内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • JavaScript中按位“异或”运算符使用介绍

    JavaScript中按位“异或”运算符使用介绍

    按位“异或”运算符 (^)是对两个表达式执行按位异或,下面为大家介绍下其具体的使用方法
    2014-03-03
  • JavaScript 正则表达式中global模式的特性

    JavaScript 正则表达式中global模式的特性

    这篇文章主要介绍了JavaScript 正则表达式中global模式的特性 的相关资料,需要的朋友可以参考下
    2016-02-02
  • JavaScript判断两个对象是否相等的方法总结

    JavaScript判断两个对象是否相等的方法总结

    判断两个对象是否相等是js中的一个很常见的内容,不同的编程语言和环境可能会有不同的方式来实现这一目标,在 JavaScript 中,判断两个对象是否相等主要有以下几种方法,感兴趣的小伙伴跟着小编一起来看看吧
    2024-08-08
  • 探究一道价值25k的蚂蚁金服异步串行面试题

    探究一道价值25k的蚂蚁金服异步串行面试题

    这篇文章主要介绍了探究一道价值25k的蚂蚁金服异步串行面试题,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-08-08
  • 纯HTML+CSS+JS实现优雅的Popup弹窗功能(附完整代码与最佳实践)

    纯HTML+CSS+JS实现优雅的Popup弹窗功能(附完整代码与最佳实践)

    在互联网时代,弹窗是一种常见的交互方式,它可以用于显示重要信息、广告、登录表单等,这篇文章主要介绍了纯HTML+CSS+JS实现优雅的Popup弹窗功能的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2026-02-02
  • JavaScript中的onerror事件概述及使用

    JavaScript中的onerror事件概述及使用

    onerror事件用来协助处理页面中的JavaScript错误主要包括:Window.onerror事件,img载入错误,接下来为大家详细介绍下,感兴趣的朋友可以参考下哈
    2013-04-04
  • 解析浏览器端的AJAX缓存机制

    解析浏览器端的AJAX缓存机制

    这里我们来解析浏览器端的AJAX缓存机制,来共同看一下AJAX缓存与HTTP缓存的关系以及AJAX缓存的刷新时间问题
    2016-06-06
  • js实现上下滑动轮播

    js实现上下滑动轮播

    这篇文章主要为大家详细介绍了js实现上下滑动轮播,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07
  • 微信小程序自定义支持图片的弹窗

    微信小程序自定义支持图片的弹窗

    这篇文章主要为大家详细介绍了微信小程序自定义支持图片的弹窗,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-12-12
  • JS实现图片无间断滚动代码汇总

    JS实现图片无间断滚动代码汇总

    这篇文章主要介绍了JS实现图片无间断滚动代码汇总,非常实用的特效代码,需要的朋友可以参考下
    2014-07-07

最新评论