解决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在IE中“意外地调用了方法或属性访问”

    JavaScript在IE中“意外地调用了方法或属性访问”

    FF是正常的,IE报“意外地调用了方法或属性访问”。
    2008-11-11
  • JavaScript监听手机物理返回键的两种解决方法

    JavaScript监听手机物理返回键的两种解决方法

    JavaScript没有监听物理返回键的API,所以只能使用 popstate 事件监听。接下来通过本文给大家分享JavaScript监听手机物理返回键的两种解决方法,感兴趣的朋友一起看看吧
    2017-08-08
  • JavaScript实现捕获鼠标坐标

    JavaScript实现捕获鼠标坐标

    这篇文章主要为大家详细介绍了JavaScript实现捕获鼠标坐标,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-04-04
  • JavaScript调用C语言的几种方式

    JavaScript调用C语言的几种方式

    本文主要介绍了JavaScript调用C语言的几种方式,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2023-02-02
  • js 深拷贝函数

    js 深拷贝函数

    Javascript中的对像赋值与Java中是一样的,都为引用传递.就是说,在把一个对像赋值给一个变量时,那么这个变量所指向的仍就是原来对像的地址.那怎么来做呢 答案是克隆.
    2008-12-12
  • 使用JS中的Replace()方法遇到的问题小结

    使用JS中的Replace()方法遇到的问题小结

    这篇文章主要介绍了使用JS中的Replace()方法遇到的问题小结,需要的朋友可以参考下
    2017-10-10
  • JavaScript中神奇的call()方法

    JavaScript中神奇的call()方法

    这篇文章主要介绍了JavaScript中神奇的call()方法,本文用浅显的语言帮助你加深理解call()方法,需要的朋友可以参考下
    2015-03-03
  • JavaScript语句错误throw、try及catch实例解析

    JavaScript语句错误throw、try及catch实例解析

    这篇文章主要介绍了JavaScript语句错误throw、try及catch实例解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-08-08
  • JavaScript 数组常见操作技巧 (二)

    JavaScript 数组常见操作技巧 (二)

    这篇文章主要介绍了JavaScript 数组常见操作技巧,上一篇文章已经给大家分享了(一),下面紧接上一篇文章分享下面技巧,需要的小伙伴可以参考一下
    2022-02-02
  • 基于JavaScript实现弹出框效果

    基于JavaScript实现弹出框效果

    弹出框在网站页面中是必不可少的一部分,今天借助脚本之家平台给大家分享使用js实现简单的弹出框效果,感兴趣的朋友一起学习吧
    2016-02-02

最新评论