美文网首页
uni-app之微信小程序分包

uni-app之微信小程序分包

作者: 浅睡的入梦 | 来源:发表于2020-12-08 15:14 被阅读0次

因小程序有体积和资源加载限制,各家小程序平台提供了分包方式,优化小程序的下载和启动速度。所谓的主包,即放置默认启动页面/TabBar 页面,以及一些所有分包都需用到公共资源/JS 脚本;而分包则是根据pages.json的配置进行划分。现在目前微信支持每个包是2M,记住是单个包不能超过2M,总包不超过16M,有部分小程序收到微信邀请测试总包上限提至20M。

假设目录结构为:

1.配置manifest.json

"mp-weixin": {

"optimization":{"subPackages":true}

}

2.配置pages.json

在pages.json中新建数组"subPackages",数组中包含两个参数:1.root:为子包的根目录,2.pages:子包由哪些页面组成,参数同pages;值得注意是主包和分包是不能再同一目录下,所以在构建项目时,可以考虑一下目录结构,以便后期进行分包;

3.分包预载配置(preloadRule)

在pages.json中配置preloadRule后,在进入小程序某个页面时,由框架自动预下载可能需要的分包,提升进入后续分包页面时的启动速度;preloadRule 中,key 是页面路径,value 是进入此页面的预下载配置,每个配置有以下几项:

举个栗子🌰:

4.附上最终分包pages.json

注意:旧项目使用分包时,建议分包完成后,把dist包删除,清除微信开发者工具的缓存,且重启微信开发者工具;以免缓存导致各种问题;最后附上uni-app官方分包文档链接:https://uniapp.dcloud.io/collocation/pages?id=subpackages

相关文章

  • uni-app之微信小程序分包

    因小程序有体积和资源加载限制,各家小程序平台提供了分包方式,优化小程序的下载和启动速度。所谓的主包,即放置默认启动...

  • uni-app微信小程序开发 - 环境搭建与初体验

    利用uni-app开发微信小程序,要比单纯的开发微信小程序方便很多。uni-app不仅有vue的便利,还可以使用微...

  • 自定义条件编译

    缘由: uni-app同一套代码 无法区分 微信小程序插件 和微信小程序 当前项目开发微信小程序、支付宝小程序、业...

  • 微信小程序:分包报错

    微信提供了分包加载目前小程序分包大小有以下限制: 整个小程序所有分包大小不超过 8M 单个分包/主包大小不能超过 ...

  • 2019-06小程序升级简要

    微信小程序分包加载 包的限时 整个小程序所有分包大小不超过 8M 单个分包/主包大小不能超过 2M 分包规则(普通...

  • uni-app唤醒小程序

    uni-app跳转小程序 场景 在uni-app中的安卓程序里,跳转微信小程序 配置步骤 配置APP和小程序 AP...

  • 微信小程序性能优化实践

    历史回顾: 微信小程序自定义组件 - 表格组件来啦 通过微信小程序来实现 “钉钉打卡” 记一次微信小程序项目分包,...

  • 微信小程序分包加载设置

    设置分包加载 微信小程序分包限制为: 主包或者单个分包最大为2M 整体小程序所有包最大为8M 为什么需要设置分包?...

  • 2021-11-05

    uni-app配置微信小程序调试 1.打开manifest.json-->微信小程序设置,然后填写AppID 2....

  • uni-app微信小程序运行

    uni-app微信小程序运行 github地址,喜欢的可以star下哦 新手可能使用uni-app开发时,想在微信...

网友评论

      本文标题:uni-app之微信小程序分包

      本文链接:https://www.haomeiwen.com/subject/emezwktx.html