webpack 的externals配置

 

• 官网解释：

webpack 中的 externals 配置提供了不从 bundle 中引用依赖的方式。解决的是，所创建的 bundle 依赖于那些存在于用户环境(consumer environment)中的依赖。

怎么理解呢，意思是如果需要引用一个库，但是又不想让webpack打包（减少打包的时间），并且又不影响我们在程序中以CMD、AMD或者window/global全局等方式进行使用（一般都以import方式引用使用），那就可以通过配置externals。

这样做的目的就是将不怎么需要更新的第三方库脱离webpack打包，不被打入bundle中，从而减少打包时间，但又不影响运用第三方库的方式，例如import方式等。

 默认情况下，你导入几个第三方依赖包都会合并到一个js文件里面去，最终这个文件的体积会相当大，如果你能一些能够拆出的依赖项给它声明到externals这个节点中去，那么在打包期间webpack会先检查程序员有没有在extrernal里面去声明一些第三方的依赖包，如果有的话，webpack就不会把对应的依赖包打包到对应的里面中去，而是在用到这个依赖包的时候直接去window全局对象上查找，现成的对象进行使用，排除某些包不被打包到文件里去