uniapp的分包和预加载进行项目优化

配置要求

因小程序有体积和资源加载限制，各家小程序平台提供了分包方式，优化小程序的下载和启动速度。
所谓的主包，即放置默认启动页面/TabBar 页面，以及一些所有分包都需用到公共资源/JS 脚本；而分包则是根据pages.json的配置进行划分。
在小程序启动时，默认会下载主包并启动主包内页面，当用户进入分包内某个页面时，会把对应分包自动下载下来，下载完成后再进行展示。此时终端界面会有等待提示。
需要在mainifest.json中配置 “optimization”:{ “subPackages”:true }
subPackages 里的pages的路径是 root 下的相对路径，不是全路径。
微信小程序每个分包的大小是2M，总体积一共不能超过20M。
百度小程序每个分包的大小是2M，总体积一共不能超过8M。
支付宝小程序每个分包的大小是2M，总体积一共不能超过8M。
QQ小程序每个分包的大小是2M，总体积一共不能超过24M。
字节小程序每个分包的大小是2M，总体积一共不能超过16M（字节小程序基础库 1.88.0 及以上版本开始支持，字节小程序开发者工具请使用大于等于 2.0.6 且小于 3.0.0 的版本）。
快手小程序每个分包的大小是2M，总体积一共不能超过24M。
分包下支持独立的 static 目录，用来对静态资源进行分包。

    "mp-weixin" : {
        "appid" : "xxx",
        "setting" : {
            "urlCheck" : false
        },
        "usingComponents" : true,
        "optimization":{ "subPackages":true }
    },
    "h5" : {
        "title": "xxxx",
        "router" : {
            "mode" : "hash",
            "base" : "/m"
        },
        "async" : {
            "timeout" : 60000
        },
        "optimization": {
            "preload": true,
            "treeShaking": {
                "enable": true
            }
        },
        "publicPath": "/"
    },

然后在pages.json中进行具体分包配置

 "subPackages": [{
	root:'跟目录文件路径'，
	pages：[{
		path:string,
		style:object
	}],
}]

预加载配置

在pages.json中进行相关配置
预加载中key为想要实现预加载的页面名称
value中 network指定网络。 packages指定分包的root或name

   "preloadRule":{
        "主包例如-》pages/index/index":{
            "network":"all",
            "packages":["subPages"]
        },
        "主包":{
            "network":"all",
            "packages":["subPages"]
        },
        "主包":{
            "network":"all",
            "packages":["subPages"]
        },
        "主包":{
            "network":"all",
            "packages":["subPages"]
        }
    },

会自动加载主包下的subpage中的子包

分包

"subPackages":[
	{
		"root":"根目录的文件",
		"pages":[
			将页面配置写在这里
			{}.....
			eg：
			  {
                    "path": "person/index",
                    "style": {
                        "navigationStyle": "default",
                        "navigationBarTitleText": "个人中心",
                        "h5": {
                            "titleNView": {
                                "titleText": "个人中心",
                                "titleSize": "18px"
                            }
                        }
                    }
                },
		]
	}
]