uniapp项目分包优化(项目化开发的重点)
1.优化分包要求
目前小程序分包大小有以下限制:
- 整个小程序所有分包大小不超过 20M
- 单个分包/主包大小不能超过 2M
分包的目的:对小程序进行分包,可以优化小程序首次启动的下载时间,以及在多团队共同开发时可以更好的协同合作。
2.uniapp分包项目目录(新建的项目来说明分包流程)
这是我分包小程序之后的目录结构
1.components:公共组件(供主包引用)
2.subpkg等这些文件的就是分包(我这里之创建了一个分包目录)
3.分包里的components是单个分包自己的组件目录,分包vue页面的引用只能是在自己分包目录下的文件才可以引用
4.pages是主包,里面都是启动页面/TabBar 页面
5.static里放的是公共静态资源,图片类
步骤:
1.配置manifest.json
"mp-weixin": {
"optimization":{"subPackages":true}
}
2.配置pages.json
在pages.json中新建数组"subPackages",数组中包含两个参数:1.root:为子包的根目录,2.pages:子包由哪些页面组成,参数同pages;
注意:主包和分包是不能再同一目录下,在构建uniapp项目时,可以考虑一下目录结构,以便后期进行分包;
3.分包预载配置(preloadRule)
做这一步主要为了优化速度,不想优化速度的可以跳过这个配置
目的:配置preloadRule后,在进入小程序某个页面时,由框架自动预下载可能需要的分包,提升进入后续分包页面时的启动速度,提供更好的用户体验。
preloadRule 中,key 是页面路径,value 是进入此页面的预下载配置,每个配置有以下几项:
字段 | 类型 | 必填 | 默认值 | 说明 |
---|---|---|---|---|
packages | StringArray | 是 | 无 | 进入页面后预下载分包的 root 或 name 。__APP__ 表示主包。 |
network | String | 否 | wifi | 在指定网络下预下载,可选值为:all(不限网络)、wifi(仅wifi下预下载) |
4.看下分包后的依赖项吧
5.上传后的项目分包大小
6.看一下优化后的界面效果
确实比之前上传文件小很多,而且页面打开速度以及运行优化很多哦
https://uniapp.dcloud.io/collocation/pages?id=subpackages
yw19980808: 你好,请问消息推送成功后安卓端app右上角为什么不会自动创建角标
m0_72302311: 绝了 为什么template下不能有注释啊
爱池鱼的酱酱仔: 透传和云函数里面方法是两码事,你看unipus2文档有个参数
ChurinHe: 请问uni-cloud-push扩展库的sendMessage方法,可以实现透传消息推送吗
不爱学习的小码农: 请我问一下我表头这样写宽度定死了对不齐你有这种问题吗