父类与子类均引入Lodash，Webpack打包会重复包含其代码吗？

嘿，这个问题其实挺常见的，答案是不会——默认配置下Webpack不会把Lodash打包两次。

核心原因：Webpack的模块缓存机制 #

Webpack在构建依赖图的时候，会对每个模块做唯一性识别。当你的父类和子类都通过import _ from 'lodash'引入Lodash时，Webpack会发现这两个引入指向的是同一个模块（也就是node_modules/lodash下的代码），它只会把这个模块解析、打包一次，然后在Parent和Child需要用到Lodash的地方，复用这个已打包好的模块内容。

几个可能导致重复打包的例外情况 #

当然也有特殊情况会触发重复打包，但你的例子里不存在这些场景：

• 如果父类和子类引入的是不同版本的Lodash（比如一个用lodash@4.x，一个用lodash@3.x），Webpack会把它们当成两个独立模块，分别打包。
• 如果是通过非标准的模块引入方式（比如用require动态加载且路径处理异常），可能会触发重复打包，但你的代码里是标准的ES模块import，不会有这个问题。

额外优化小提示 #

如果想进一步减少Lodash的打包体积，你可以试试按需引入的方式：

• 改用lodash-es，它支持ES模块的 tree-shaking：import { debounce } from 'lodash-es'
• 配合babel-plugin-lodash插件，让Webpack自动识别并打包你用到的Lodash方法，而不是整个库

内容的提问来源于stack exchange，提问作者Uchit Kumar