uniapp----分包-Toy模板网

这篇具有很好参考价值的文章主要介绍了uniapp----分包。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

系列文章目录

uniapp-----封装接口

uniapp-----分包

系列文章目录

uniapp-----封装接口

uniapp-----分包

前言

二、使用步骤

1.创建文件

编辑

2.min.js的修改

2.1 subPackages 代码如下（示例）：

2.2 preloadRule 代码如下（示例）：

三、注意点

总结

前言

还是同样的需求（uniapp的主包要求大小不得大于2MB），但是就算将能封装的都封装了还是会超过2MB，本文将介绍第二个优化点：分包开发

一、什么是分包开发？

有很多小伙伴一听分包开发认为就是多建几个文件夹，到时候引用就行了，说对对，但也不对，慢慢看下去就知道原因了：

首先是官网的介绍：

uniapp----分包,uniapp性能优化,uni-app,团队开发,前端

可能说的不是特别清晰，大概意思就是：创建文件，并在min.js中添加路径，并添加下载事件

二、使用步骤

1.创建文件

文件目录如下（示例）：

其中fineFood、scattered、start、static是分包，pages是主包

2.min.js的修改

2.1 subPackages 代码如下（示例）：

	"subPackages": [{//分包的所有的路径都在该方法中声明
		{
			"root": "static",//分包文件名称
			"pages": [{//配置路径
				"path": "index/index",//路径
				"style": {//导航栏样式
					"navigationStyle": "custom", // 隐藏系统导航栏
					"navigationBarTextStyle": "white"
				}
			}]
		}
	],

uniapp----分包,uniapp性能优化,uni-app,团队开发,前端

2.2 preloadRule 代码如下（示例）：

"preloadRule": {//下载配置
		"pages/index/index": {//进入到这个页面
			"network": "all",//不限制网络
			"packages": ["fineFood"]//下载名字未fineFood的分包
		}
	},

三、注意点

当分包和主包的路径重复（即：分包有文件的路径，主包还有）就会产生报错（大致意识为：这个地方不应该出现这个东西），这个时候只要把pages里的分包路径删除就可以了

原因： uniapp----分包,uniapp性能优化,uni-app,团队开发,前端

选中这个选项后，会默认在主包添加一次路径

总结

分包对于中、大型项目开发来说是非常有必要的，因为2MB根本做不了什么好看的项目，所以分包开发这个技术一定要会，可以不用但一定要知道怎么解决超出限制问题

喜欢的小伙伴可以点个关注后续还会继续发布关于uniapp优化的文章文章来源地址https://www.toymoban.com/news/detail-649525.html

到了这里，关于uniapp----分包的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！

uniapp----分包

系列文章目录

uniapp-----封装接口

uniapp-----分包

前言