Webpack 在最终包中包含未使用的导出(不是摇树)

Question

我有一个设置，其中一个库的 index.js(主入口点)导出 lib 中的所有内容......所以它的设置是这样的:

export * from "./mod1"
export * from "./mod2"
// etc...

( take a look )

当我从该入口点导入 1 个导出的库时，看起来 Webpack 无法摇动输出。运行 webpack -p实际上将整个库包含在包中，尽管只导入了一个导出。运行 webpack (非生产捆绑)确实显示 unused harmony export ....在整个文件中(167 次)，但为什么它们没有被删除？

我有一个测试设置在这里显示这个问题: https://github.com/purtuga/webpack-bundle-test

希望有人(比我更聪明:))可以帮助确定我做错了什么。

/保罗

Answer 1

我克隆了你的“webpack-bundle-test”，这就是我所做的。

从 https://github.com/purtuga/common-micro-libs 复制“common-micro-libs”src 文件夹.

将 mod3.js 中的代码编辑为:import { objectExtend } from "./common-micro-libs"
export default mod3 = objectExtend({}, { text: "module 3" });

我跑了webpack在本地，发现了 167 条“未使用的和谐”评论。

与 webpack -p我得到了以下结果:

将 mod3.js 中的代码更改为 import objectExtend from "./common-micro-libs/jsutils/objectExtend.js"
export default mod3 = objectExtend({}, { text: "module 3" }); .

通过上述更改，我可以看到包大小的以下减小

我相信在导入依赖项时，最好只从库中导入必要的功能/组件，这样会更有效地打包在包中。
我无法解释为什么会这样，尽管我在使用 lodash 时在我的项目中导入实用程序时遵循相同的原则并且它工作正常。
你能运行测试并让我知道吗？