pointsMall/vue.config.js

const {
  defineConfig
} = require('@vue/cli-service')
const CompressionWebpackPlugin = require('compression-webpack-plugin')
// 代码压缩
const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
const cdn = {
  js: [
    // `https://cdn.bootcdn.net/ajax/libs/vue/2.6.14/vue.min.js`,
    // `https://cdn.bootcdn.net/ajax/libs/element-ui/2.15.14/index.min.js`,
    // `https://cdn.bootcdn.net/ajax/libs/axios/0.17.1/axios.min.js`,
    // `https://cdn.bootcdn.net/ajax/libs/vue-router/3.5.1/vue-router.min.js`,
  ]
};
const timestamp = new Date().getTime();
module.exports = defineConfig({
  devServer:{
    host: '192.168.100.104',
    open:true
  },
  transpileDependencies: true,
  lintOnSave: false, //关闭eslint检查
  // 具体使用情况还需要看项目的配置
  publicPath: process.env.NODE_ENV === 'production' ? './' : '/',
  assetsDir: 'static',
  css: {
      extract: {
          filename: `assert/css/[name].${timestamp}.css`,
          chunkFilename: `assert/css/[name].${timestamp}.css`
      }
  },
  configureWebpack: {
    output: {
        filename: `assert/js/[name].${timestamp}.js`,
        chunkFilename: `assert/js/[name].${timestamp}.js`
    },
    externals: {
      // vue: 'Vue',
      // 'vue-router': 'VueRouter',
      // axios: 'axios',
      // 'element-ui': 'ELEMENT',
    },
    plugins: [
      new CompressionWebpackPlugin({
        algorithm: "gzip",
        test: /\.js$|\.html$|\.css$/, // 匹配文件名
        threshold: 10240, // 对超过10k的数据压缩
        deleteOriginalAssets: false, // 不删除源文件
        minRatio: 0.8 // 压缩比
      }),
      new UglifyJsPlugin({
        uglifyOptions: {
          compress: {
            drop_debugger: true,
            drop_console: true,
            pure_funcs: ['console.log']
          },
          output: {
            // 去掉注释内容
            comments: true
          }
        },
        sourceMap: false,
        parallel: true
      }),
    ],
  },
  chainWebpack: config => {
    config.plugin("html").tap(args => {
      args[0].cdn = cdn;
      return args;
    });
  }
})