为什么所有的lodash最终都出现在我的webpack构建中

Why is all of lodash ending up in my webpack build?

本文关键字：我的 webpack 构建 lodash 为什么      更新时间：2023-09-26

我已经检查了包含它的所有库，它们都通过完整路径包含函数，即：import find from 'lodash/find'。

Redux是使用它的主要依赖项，我也检查了他们的代码，它通过其完整路径正确地导入了每个函数。

以下是我的webpack构建可视化的json输出：

https://www.dropbox.com/s/njjjtgtw19d52j6/Screenshot%202016-10-30%2006.27.44.png？dl=0

正如你所看到的，lodash占据了很大的比例，而它只使用了少数方法。使用webpack-bundle-size-analyzer的lodash达到135kb(当然是预缩小和gzipped(，但它仍然比应该的大得多。

其他人经历过这种情况吗？我觉得这有点多余。

更新：我发现一个包使用点语法导入lodash函数：import find from 'lodash.find'。也许是这样。点语法和全路径语法之间有什么区别？

使用babel插件lodash将所有导入的lodash方法(如import { map } from 'lodash';(转换为对import _map from 'lodash/map';:的直接引用

{
  "plugins": ["lodash"],
  "presets": ["es2015"]
}

将它与lodash webpack插件结合起来，只包含您需要的功能：

plugins: [
     new LodashModuleReplacementPlugin({ 'collections': true })
]
相关文章：