uniapp(10)一篇解决分包加载:source size 2163KB exceed max limit 2MB

二维码预览,真机调试,发布微信小程序都有一个前提:
所有分包大小不超过 20M
单个分包/主包大小不能超过 2M
比如出现错误:message:Error: 系统错误,错误码:80051,source size 2163KB exceed max limit 2MB.

在这里插入图片描述

(1)建议分包之前先"微信开发者工具"和手机,测试完你的项目流程。Hbuilder可以在运行时,压缩代码,本地代码会减少一大半,你就可以手机测试啦。分包前,建议copy一份,别写错。

uniapp(10)一篇解决分包加载:source size 2163KB exceed max limit 2MB_第1张图片
在这里插入图片描述

(2)第一步:首先在微信开发者工具,点击代码依赖分析,然后点击主包进去,可以看是哪个文件太大:

1. 图片过大,就压缩图片。
2. 大图片过多,尽量放线上。
3. 小图比如按钮图片,优先加载的放本地。
4. 按钮图标等图片,尽量使用icon。

在这里插入图片描述
uniapp(10)一篇解决分包加载:source size 2163KB exceed max limit 2MB_第2张图片

(3)代码还是过大,再想着分包。

1. Tabbar页面都放在pages里,公共组件都放在component。

uniapp(10)一篇解决分包加载:source size 2163KB exceed max limit 2MB_第3张图片

2. 除了Tabbar页面可以分出来,建议按照模块\功能等分包。

3. 例如A模块引用了a组件,那就在该A包建立components,放入a组件。

uniapp(10)一篇解决分包加载:source size 2163KB exceed max limit 2MB_第4张图片

4. 不同包内的组件不能跳转,不同包的页面可以来回跳转。所以小心点。
5. subPackages:叫分包,是放页面的,组件都不用放的,你每个页面需要什么组件就import。下面我会举栗子的!!!


 //吃个栗子 :
//所有页面引入组件都要,import和注册组件哦
import Example from '../../components/Example/Example.vue'
export default{
	components:{
		Example 
	}
}

//分包A的a组件想跳转到分包B的b页面,注意使用-->绝对路径
uni.navigateTo({
	url:"/packAgeB/b/b",
	success:function(res){
		console.log("成功",res)
	},fail:function(res) {
		console.log("失败",res)
	}
})


关于分包跳转详情看这里—》uniapp(18)分包后跳转页面并更改数据

你可能感兴趣的:(战胜uniapp,小程序,微信)