无法使用 webpack 导出/摇树工作

Question

我花了好几个小时想让webpack对我的代码进行树摇。这是reppro: https://github.com/dmt0/treeshake-repro

问题是，即使我只从@mdi/js导入几个图标，整个2.6MB的包也会被导入。

多次重读webpack文档，看到了多个SO问题和GH问题。我确实有以下内容:

• 包。json

"sideEffects": [
"*.scss",
"*.css"
],

• Babel配置了"modules": false

• webpack config hasusedExports: true.

• Terser配置为执行3次传递(请注意，有时一次传递是不够的)。

• production模式开启

• providedExports和usedExports使能

• sideEffects在导入库的package.json中设置为false:

我错过了什么?

Answer 1

问题是在一些完全不相关的设置-devtool。不知道为什么它打破了树摇。自从webpack的某个旧版本以来，这个配置文件中从未更改过。

devtool: env.production ? 'hidden-source-map' : 'eval-source-map',

:

devtool: argv.mode === 'production' ? 'hidden-source-map' : 'eval-source-map',

现在摇树工作正常，我的包大小明显下降。