vendor.js超1.5MB主因是第三方库未按需引入或static图片未压缩;快速定位:在dist/build/mp-weixin中按文件大小排序,前5个大.js/.png即元凶;须同时开启manifest.json中subPackages和runtimeCompress。

直接看 unpackage(App)或 dist/build/mp-weixin(小程序)目录里真实产出的文件大小,别信构建日志里的模糊提示——vendor.js 超 1.5MB,90% 是因为第三方库没按需引入,或者图片没压缩就拖进了 static/。
怎么快速定位哪个文件在撑大体积
Windows 资源管理器打开 dist/build/mp-weixin,点「查看 → 详细信息 → 大小」列排序;macOS 用 Finder 列表视图 + 按大小排序。前 5 个最大的 .js 或 .png 就是元凶。
-
chunk-vendors.[hash].js异常大?说明node_modules里的库(比如echarts、uview-ui)被全量打进去了 -
static/下某张 PNG 超 800KB?设计稿截图直传,微信开发者工具不会自动压缩 - 某个分包文件夹总大小超 2MB?检查里面有没有未外部化的字体或大 JSON 配置
第三方库必须按需引入,不是 import 就算
写 import { uButton } from 'uview-ui' 不等于生效——uni-app 默认不识别这种写法,仍会打包全量 UI 库。得配 babel-plugin-import 或改 vue.config.js:
- 对
uView:在vue.config.js的configureWebpack.plugins里加babel-plugin-import,libraryName: 'uview-ui' - 对
echarts:禁用import * as echarts from 'echarts',改用import * as echarts from 'echarts/lib/echarts'+ 单独require('echarts/lib/chart/bar') - 对
lodash:别引lodash,改用lodash-es+import debounce from 'lodash-es/debounce'
分包配置写对了,但 vendor.js 还是没变小
缺了 manifest.json 里的两个关键开关:subPackages 和 runtimeCompress 必须同时开启,否则分包代码仍会被塞进主包 vendor.js。
- 在
manifest.json的mp-weixin节点下加:
{
"mp-weixin": {
"optimization": {
"subPackages": true,
"runtimeCompress": true
}
}
}
runtimeCompress 不是压缩图片,是移除 JS 注释、空格、调试逻辑,实测减 1.2–1.8MBsubPackages: true,哪怕 pages.json 写了分包,vendor.js 也照旧膨胀真正难啃的是那些“悄悄回归主包”的路径:比如 subNVue 文件放在 components/ 而非分包目录内,或者自定义 tabBar 组件没放进 subPackages.root 指定的路径下——它们不会报错,但会默默把代码打回主包。











