text: const Host = 'http://localhost:3000';
  const webpack = require('webpack');
  
  // cdn链接
  const cdn = {
    css: [
      // antd css 由于引入失败只好放弃了antd的按需引入
    ],
    js: [
      // vue
      'https://cdn.bootcdn.net/ajax/libs/vue/2.6.10/vue.min.js',
      // vue-router
      'https://cdn.bootcdn.net/ajax/libs/vue-router/3.1.3/vue-router.min.js',
      // vuex
      'https://cdn.bootcdn.net/ajax/libs/vuex/3.1.2/vuex.min.js',
      // axios
      'https://cdn.bootcdn.net/ajax/libs/axios/0.18.0/axios.min.js',
      // moment
      'https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.27.0/moment.min.js',
    ],
  };
  
  const CompressionWebpackPlugin = require('compression-webpack-plugin');
  
  module.exports = {
    chainWebpack: (config) => {
      // 需要打包分析时取消注释
      // config.plugin('webpack-bundle-analyzer').use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin);
  
      // 配置cdn引入
      if (process.env.NODE_ENV === 'production') {
        let externals = {
          vue: 'Vue',
          axios: 'axios',
          'vue-router': 'VueRouter',
          vuex: 'Vuex',
          moment: 'moment',
        };
        config.externals(externals);
        // 通过 html-webpack-plugin 将 cdn 注入到 index.html 之中
        config.plugin('html').tap((args) => {
          args[0].cdn = cdn;
          return args;
        });
      }
    },
    configureWebpack: (config) => {
  
      // 代码 gzip
      const productionGzipExtensions = ['html', 'js', 'css'];
      config.plugins.push(
        new CompressionWebpackPlugin({
          filename: '[path].gz[query]',
          algorithm: 'gzip',
          test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
          threshold: 10240, // 只有大小大于该值的资源会被处理 10240
          minRatio: 0.8, // 只有压缩率小于这个值的资源才会被处理
          deleteOriginalAssets: false, // 删除原文件
        })
      );
  
      // 不打包moment的语言包
      config.plugins.push(new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/));
    },
    css: {
      loaderOptions: {
        less: {
          lessOptions: {
            modifyVars: {
              'primary-color': 'skyblue',
              // 'link-color': '#1DA57A',
              // 'border-radius-base': '2px',
            },
            javascriptEnabled: true,
          },
        },
        sass: {
          prependData: "@import '@/theme/index.scss';",
        },
      },
    },
    // webSocket本身不存在跨域问题，所以我们可以利用webSocket来进行非同源之间的通信。
    publicPath: '/',
    devServer: {
      port: 1997,
      proxy: {
        '/api': {
          target: Host,
          ws: true,
          changeOrigin: true,
          pathRewrite: {
            '^/api': '',
          },
        },
        'socket.io': {
          target: Host,
          ws: true,
          changeOrigin: true,
        },
      },
    },
    productionSourceMap: false,
  };
  