vue中不打包第三方库为什么要配置externals?

Question

vue在进行打包的时候，第三方库一般会使用cdn引入，减小打包体积。
既然使用cdn引入了为什么还要配置externals呢？直接全局使用就行了，是为了可以继续使用import require语句吗？
我的个人理解：其实直接cdn引入就可以直接使用第三方库，配置externals主要是兼容项目中之前的import require语法。
不知道理解的对不对

Answer 1

配置externals是为了防止将某些 import 的包(package)打包到 bundle 中，而是在运行时(runtime)再去从外部获取这些扩展依赖(external dependencies)。它的主要作用是为了部署生成环境的时候可以将一些第三方库排除在打包的范围之外，可以通过引入CDN的方式减少文件体积，提升浏览速度。

对于你说的“既然使用cdn引入了为什么还要配置externals”，其实两者不冲突，只是webpack为用户提供了一种方便。这里有一个适用场景，试想一下以下这种情况，当你接手一个老项目，里面有许多页面通过import的方式引入了某个第三方库，但是现在的需求是需要将这个第三方库从bundle里抽离出来，通过CDN的方式引入，这时候你就只需要在externals里配置一下就可以了，而不需要去每一个页面单独修改。

另外，也不排除有些无法通过CDN的方式来引入，并且只工作在开发环境用来测试的库，这时候external属性就是一个很好的解决办法