微信小程序主包大小问题的终极解决方案
针对uniapp开发的微信小程序主包太大，主包体积优化终极解决方案！【subpackage-optimize】
网上找了很多普遍大众的优化方法都试过了，分包、图片、组件、公共库、图标、文件迁移这些都已经做到极致了优化了，奈何主包的大小还是超出2M，小程序的功能又多，开发无限制，分了好几个包了
最后才实现这套终极优化方案，各位开发微信小程序真的实在到没办法控制主包大小的，可以直接用我这套方法优化，保你减少至少几百kb，而且非常方便。
我已经实现了减了400kb左右，这样下去，微信小程序后续增加功能还能坚持再开发个几年的。
进入主题，只需两步，非常方便和容易操作！！
一、先安装
在项目根目录下执行命令即可，安装npm包
1 | npm i subpackage-optimize |
二、配置
1、在项目根目录下创建 vue.config.js 文件，已有此文件跳过即可
01 02 03 04 05 06 07 08 09 10 11 | const UniPackageOptimization = require('subpackage-optimize');const pro = process.env.NODE_ENV === 'production'; // 判断生产环境module.exports = { configureWebpack: config => { // 微信小程序打包优化 // 需要其他平台小程序打包优化增加判断就可以了 if(process.env.UNI_PLATFORM === "mp-weixin" && pro) { config.plugins.push(new UniPackageOptimization(['components'], [])) } }} |
UniPackageOptimization 构造函数说明
UniPackageOptimization 接收两个参数
第一个参数是打入分包的一级目录数组
第二个参数是不打入分包的一级目录下的目录数组，第二个参数可以为空数组
UniPackageOptimization 说明中指的目录都是编译后文件的目录
2、配置 manifest.json 文件
在对应平台的配置下添加 "optimization" : {“subPackages”: true } 开启分包优化
目前只支持mp-weixin、mp-qq、mp-baidu、mp-toutiao、mp-kuaishou的分包优化
例如下列配置：
1 2 3 4 5 6 7 8 | "mp-weixin": { "appid": "", "usingComponents": true, "optimization": { // 开启分包优化 "subPackages": true } }, |
注意事项
1.如果被打入分包的组件中有 slot 插槽，请使用第二个参数将该组件目录从分包中剔除，否则可能会导致样式错乱，比如弹窗组件就不建议打入分包中
2.打入分包的目录下必须有 .vue 文件
转自：https://www.52pojie.cn/thread-2119250-1-1.html
