Webpack引入CDN链接优化打包后的体积

BootCDN官网

项目开发完成后，使用webpack打包的文件都比较大，所以我就想使用什么办法来优化一下。

本文主要是讲解在 vue-cli 中如何利用CDN实现打包文件体积优化问题。

如下图所示，是我整个项目打包后资源的分布，其中红色标注部分是占用体积最大的。一个显示的是图片资源，另一个显示的是js。

图片资源好说，这里主要讲解一下这个JS文件。我百度了一下这个vendor文件。然后根据提示，在config/webpack.prod.conf.js文件下，有如下相关代码：

new webpack.optimize.CommonsChunkPlugin({
   
      name: 'vendor',
      minChunks (module) {
   
        // any required modules inside node_modules are extracted to vendor
        // 翻译注释：所有被依赖的模块，如果它在node_modules目录中，都会被抽离出来放进 vendor.js 中
        // 如果模块有一个路径，而且在路径中有 js 文件，并且这个模块是属于 node_modules 中的模块
        // 那这个模块就会被抽离出来，放进名为 vendor 的这个