基于uni-app的微信小程序之分包

关于分包

规定小程序不能超过2M,一旦超过就需要分包

注意事项

subPackages 里的pages的路径是 root 下的相对路径，不是全路径。
微信小程序每个分包的大小是2M，总体积一共不能超过16M。
百度小程序每个分包的大小是2M，总体积一共不能超过8M。
支付宝小程序每个分包的大小是2M，总体积一共不能超过4M。
QQ小程序每个分包的大小是2M，总体积一共不能超过24M。
分包下支持独立的 static 目录，用来对静态资源进行分包。
uni-app内支持对微信小程序、QQ小程序、百度小程序分包优化，即将静态资源或者js文件放入分包内不占用主包大小。详情请参考：关于分包优化的说明
针对vendor.js过大的情况可以使用运行时压缩代码
HBuilderX创建的项目勾选运行–>运行到小程序模拟器–>运行时是否压缩代码
cli创建的项目可以在pacakge.json中添加参数–minimize，示例：“dev:mp-weixin”: “cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service uni-build --watch --minimize”

使用方法

首先你得有个uniapp的微信小程序项目

这里假设你有了,原始项目结构

用微信开发工具打开的样子,没有分包之前

在pages同级创建分包

pages.json配置

然后呢,官网支持了 分包优化
在对应平台的配置下添加"optimization":{“subPackages”:true}开启分包优化
目前只支持mp-weixin、mp-qq、mp-baidu的分包优化
分包优化具体逻辑：
静态文件：分包下支持 static 等静态资源拷贝，即分包目录内放置的静态资源不会被打包到主包中，也不可在主包中使用
js文件：当某个 js 仅被一个分包引用时，该 js 会被打包到该分包内，否则仍打到主包（即被主包引用，或被超过 1 个分包引用）
自定义组件：若某个自定义组件仅被一个分包引用时，且未放入到分包内，编译时会输出提示信息
我的理解呢就是,既然你分包了功能模块,那相应的静态资源你得分吧,用图片的时候直接是分包下的路径,这才是个完整的分包.

这里我以微信小程序为例,

怎么跳转呢?

在需要点击跳转的地方就好啦

 uni.navigateTo({
   url: '/myPackageA/pages/piece/piece'
 })

然后重启微信开发工具运行

可以看到已经分包成功