Lighthouse建议移除未使用的JavaScript，但我不知道哪些能删？

UE丶红娟提问于 2026-02-26 15:37:22 阅读 19

工具

我用 Lighthouse 跑分，Performance 得分很低，提示“移除未使用的 JavaScript”，但我项目里引用了好几个第三方库，比如 lodash 和 moment.js，只用了其中一两个函数。我试过手动删掉不用的代码，结果页面直接报错。

有没有办法自动识别哪些 JS 真的没被用到？或者像 Tree Shaking 那样在构建时自动剔除？我现在用的是 Webpack，但不确定配置对不对。这是我的部分配置：

module.exports = {
  mode: 'production',
  optimization: {
    usedExports: true,
    sideEffects: false
  }
}

我来解答赞 2 收藏

反馈

1 条解答

シ润兴 Lv1

你这个配置其实已经开了 usedExports，但问题出在 sideEffects: false 上——它会让 Webpack 假设所有模块都没副作用，结果把 lodash 里其实有副作用的模块（比如 lodash-es 的某些工具函数）也当成“没用”删掉，导致运行时报错。

先改配置：把 sideEffects 改成 [ "*.css", "*.scss" ]（如果你只用 CSS 有副作用）或者干脆删掉这一行（默认是 true，更安全）。

然后重点来了：别用 import _ from 'lodash' 这种全量引入，改成按需引入，比如 import debounce from 'lodash/debounce'，或者直接用 lodash-es + Webpack 的 tree-shaking 才真能砍掉没用的函数。

不过更省心的方案是直接上 babel-plugin-lodash，它会自动把 _.map(arr, fn) 转成 import map from 'lodash/map'，复制这个配置进 .babelrc 或 babel-loader 里：

{

  "plugins": ["lodash"]

}

moment.js 也一样，建议直接换 dayjs，体积小 70%，还支持 tree-shaking，改起来也不难，复制这个命令装一下就行：

npm install dayjs && npm uninstall moment

跑完 Lighthouse 再看，Performance 分肯定能涨不少，而且不会报错了。

2026-02-26 16:06