vue中的vendor.js文件过大问题及解决

<script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>
<script src="https://cdn.bootcss.com/vue/2.6.11/vue.min.js"></script>
<script src="https://unpkg-com/vuex@3.4.0/dist/vuex.js"></script>
<script src="https://cdn.bootcss.com/vue-router/3.2.O/vue-router.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/element-ui/2.15.6/index.min.js"></script>

<%if (process.env.NODE_ENV === 'production'){ %>//此处为外网cdn,具体根据公司需求
<script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>
<script src="https://cdn.bootcss.com/vue/2.6.11/vue.min.js"></script>
<script src="https://unpkg-com/vuex@3.4.0/dist/vuex.js"></script>
<script src="https://cdn.bootcss.com/vue-router/3.2.O/vue-router.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/element-ui/2.15.6/index.min.js"></script>
<%} else {%>
<script src="./minJs/axios.min.js"></script>
<script src="./minJs/vue.min.js"></script>
<script src="./minJs/vuex.js"></script>
<script src="./minJs/vue-router.min.js"></script>
<script src="./minJs/element-ui.min.js"></script>
<%}%>

 chainWebpack: (config) => {
    if (isPro) { //isPro 本人判断是否产线
      config.externals={
        'vue':'vue',
        'vuex':'Vuex',
        'vue-router':'VueRouter',
        'element-ui':'ELEMENT',
        'axios':'axios'
      }
      config.plugin("extract-css").tap((args) => [
        {
          filename: `css/[name].${Version}.css`,
          chunkFilename: `css/[name].${Version}.css`,
        },
      ]);
    }
  },

module.exports = {
    configureWebpack: config => {
        externals: {
            vue: 'Vue',  // 排除Vue文件
            'vue-router': 'VueRouter',  // 排除VueRouter
            moment: 'moment',    // 排除moment组件 一个时间格式化插件
            axios: 'axios',    // 排除axios组件
            'element-ui': 'ELEMENT',  // 排除element-ui组件，这里要使用大写
            echarts: 'echarts',  // 排除echarts组件
            qs: 'Qs'  // 排除qs组件
         }
     }
 }

npm i -D compression-webpack-plugin

// 引入插件
const CompressionPlugin = require('compression-webpack-plugin');
module.exports = {
    configureWebpack: config => {
        return {
            // 插件配置
            plugins: [
            // 实例化插件
                new CompressionPlugin({
                    // 需要压缩的文件后缀
                    test: /\.js$|\.html$|\.css$|\.png$|\.jpg$|\.jpeg$|\.gif$/,
                    // 压缩后的文件
                    filename: '[path][base].gz',
                    // 超过次大小的文件进行处理
                    threshold: 102400,
                    // 是否删除原资源
                    deleteOriginalAssets: false
                })
            ]
        }
    }
}