一次webpack 的externals配置带来的优化体验

externals官方解释：

防止将某些 import 的包(package)打包到 bundle 中，而是在运行时(runtime)再去从外部获取这些扩展依赖(external dependencies)。

1.优化前

使用echarts的一个项目，使用npm run build 打包以后还有6m左右的大小，如下：

这里打包以后文件明显过大，可能会造成用户体验差。

2.优化

考虑到可能是因为引入的echarts过大，打包时将echarts打包进去了引起的。externals可以将echars脱离webpack打包，可以用来解决这个问题。

2.1 在webpack配置文件中配置externals。

在webpack.base.conf.js文件中配置外部扩展externals，如下：

 externals: {
   
   echarts: