请教下 webpack treeshaking 优化无效的问题

为什么下面的 fn.js 还是被打包到生产环境中去了?

import { something } from './fn';

if (process.env.NODE_ENV === 'development') {
  console.log(something)
}

测试过 if 语句确实被 tree-shaking 删除了,但是 fn 是是被导入了

webpack
33 views
Comments
登录后评论
Sign In
·

是不是你的 something 还在其他地方被用到了?

·

sideEffect 的问题,可以仔细看看 webpack 的 sideEffects 配置说明:Mark the file as side-effect-free,简单说就是 webpack 的保守 treeshaking 优化导致的,虽然 import 进来的变量没有使用,但 fn.js 文件可能有副作用,比如修改 Object 原型链,常见于 polyfill,这是不能直接删除 import 语句,你可以在 package.json 中设置解决:

{
  "name": "project",
  "version": "0.0.1",
  "private": true,
  "sideEffects": false,
  ...
}