项目技术栈：uniapp+vue3+ts
报错信息：Error: 代码包大小超过限制,main package source size 2097KB exceed max limit 2048KB

• 问题背景：做ai生视频的功能，然后components目录下加了几个组件，结果打包发布时发现正好超出了一点2M的限制
• 查了别人怎么解决的，试了微信官方文档的分包，还有用cursor之类的ai帮我解决，最终都不尽人意，总结下来就是让我分包，优化vite.config.js的打包配置选项之类的，但是我的问题是打包后/dist/build/mp-weixin/common/vendor.js很大，有1.32M，按理说这个文件不该这么大
  • 项目中是做了分包的，manifest.json 中也配置了关于小程序打包优化的 setting 和 optimization
  • vite 默认是开启摇树优化的
  • ui 组件库也是按需引入的
  • 就算 package.json 中有添加并且 npm install 了，但代码中没使用的包也不会被打包到 vendor.js 中

最终解决方案

• git bisect
• 既然不是我的问题，那肯定是某次提交导致主包突然异常增大，那就定位一下
• git bisect 使用：
  • 先找到一次没有问题的提交，拿到 commit id，可以用 git log --oneline 查看提交记录
  • git bisect start：开始二分查找
  • git bisect bad：标记当前提交是坏提交（一般都是从当前也就是该分支下最后一次提交开始）
  • git bisect good [commit id]
  • 然后 git 就从坏提交和好提交之间开始自动二分查找（原理好像是自动 git checkout [二分后的 commit id]），然后就我而言，我是通过 npm run build:mp-weixn 看打包后的 vendor.js 大小来确定问题是否在当前提交已产生，如果这次提交是好的，就标记 good：git bisect good，否则标记 bad ：git bisect bad
    • 如果检查提交是好还是坏的步骤比较复杂，可以编写一个 .bat 或者 .sh
• 我的问题原因：最终定位到问题提交，发现代码中新使用到了 text-encoding 这个编解码字符的库，打包直接加 600KB，最终不用这个库，改为自己解码：decodeURIComponent(escape(String.fromCharCode(...new Uint8Array(data))))
  • 如果确定了解码字符集，比如都是从 gbk 解码成 utf-8，那也可以从 text-encoding 这个库的原文件中提取成自己需要的部分写成 js 文件，或者换个更轻量的专门解码 gbk 的库