goldenPig/vue.config.js

/*
 * @Author: your name
 * @Date: 2021-09-16 11:27:35
 * @LastEditTime: 2021-11-29 15:29:40
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \hyyfClient\vue.config.js
 */
const CompressionWebpackPlugin = require("compression-webpack-plugin");
const path = require('path')
const productionGzipExtensions = /\.(js|css|json|txt|html|ico|svg)(\?.*)?$/i;
const webpack = require('webpack')
module.exports = {
  publicPath: './', // 相对于 HTML 页面（目录相同）
  chainWebpack: config => {
    config.plugin('provide').use(webpack.ProvidePlugin, [{
      $: 'jquery',
      jquery: 'jquery',
      jQuery: 'jquery',
      'window.jQuery': 'jquery'
    }])
  },
  configureWebpack: config => {
    if(process.env.NODE_ENV === 'production') {
      config.plugins.push(
        new CompressionWebpackPlugin({
          /* [file]被替换为原始资产文件名。
             [path]替换为原始资产的路径。
             [dir]替换为原始资产的目录。
             [name]被替换为原始资产的文件名。
             [ext]替换为原始资产的扩展名。
             [query]被查询替换。*/
          filename: '[path].gz[query]',
          //压缩算法
          algorithm: 'gzip',
          //匹配文件
          test: productionGzipExtensions,
          //压缩超过此大小的文件,以字节为单位
          threshold: 10240,
          minRatio: 0.8,
          //删除原始文件只保留压缩后的文件
          //deleteOriginalAssets: false
        })
      )
    }
    config.resolve.alias = {
      '@': path.resolve(__dirname, 'src'),
      'components': '@/components',
      'views': '@/views',
      'assets': '@/assets',
      'utils': '@/utils'
    }
  },
  css: {
    loaderOptions: {
      less: {
        javascriptEnabled: true,
      }
    }
  },
  lintOnSave: false,
};