Vue.config.js配置

const path = require(`path`)
const application = require(`./src/config/application`)
const CompressionWebpackPlugin = require(`compression-webpack-plugin`)

function resolve (dir) {
  return path.join(__dirname, dir)
}

module.exports = {
  publicPath: `./`,
  assetsDir: `assets`,

  chainWebpack: (config) => {
    config.module.rule(`eslint`).
      use(`eslint-loader`).
      loader(`eslint-loader`).
      tap(options => {
        options.fix = true
        return options
      })
    // 设置项目目录别名，其余使用jsconfig的@/
    config.resolve.alias.set(`@`, resolve(`src`)).
      set(`@assets`, resolve(`src/assets`)).
      set(`@components`, resolve(`src/components`)).
      set(`@views`, resolve(`src/views`)).
      set(`@static`, resolve(`src/static`))

    /**
     * 删除懒加载模块的 prefetch preload，降低带宽压力
     * https://cli.vuejs.org/zh/guide/html-and-static-assets.html#prefetch
     * https://cli.vuejs.org/zh/guide/html-and-static-assets.html#preload
     * 而且预渲染时生成的 prefetch 标签是 modern 版本的，低版本浏览器是不需要的
     */
    config.plugins.delete(`prefetch`).delete(`preload`)

    config.when(process.env.NODE_ENV !== `development`, config => {
      //  参数配置文档: https://www.webpackjs.com/plugins/compression-webpack-plugin/
      // 前端开启gzip提升加载速度
      config.plugin(`compression`).use(CompressionWebpackPlugin, [
        {
          algorithm: `gzip`,
          test: /\.(js|css|html)$/,
          threshold: 0,
          minRatio: 0.8,
        },
      ])
    })
  },

  transpileDependencies: [],
  configureWebpack: {},

  css: {
    loaderOptions: {
      less: {
        lessOptions: {
          modifyVars: {
            'primary-color': `#2E5DFC`, // 全局主色
            'primary-color-secondary': `#2E5DFCd8`, // 全局主色
            'primary-white': `rgba(255, 255, 255, 0.85)`, // 全局主色
            'primary-white-secondary': `rgba(255, 255, 255, 0.65)`, // 全局主色
            'primary-white-disabled': `rgba(255, 255, 255, 0.45)`, // 全局主色
            'primary-drak': `rgba(0, 0, 0, 0.85)`, // 全局主色
            'primary-drak-secondary': `rgba(0, 0, 0, 0.65)`, // 全局主色
            'primary-drak-disabled': `rgba(0, 0, 0, 0.45)`, // 全局主色

            'link-color': `#2E5DFC`, // 链接色
            'success-color': `#009966`, // 成功色
            'sign-color': `#913D10`, // 标记色
            'warning-color': `#faad14`, // 警告色
            'error-color': `#D82431`, // 错误色

            'heading-color': `rgba(0, 0, 0, 0.85)`, // 标题色
            'text-color': `rgba(0, 0, 0, 0.85)`, // 主文本色
            'text-color-secondary': `rgba(0, 0, 0, .65)`, // 次文本色
            'disabled-color': `rgba(0, 0, 0, .45)`, // 失效色

            'dividing-line-color': `#eeeeee`, // 分割线颜色

            'border-color-base': `#a0a0a0`, // 边框色
            'border-color-base-secondary': `#cccccc`, // 边框色
            'border-base': `1px solid @border-color-base`,
            'border-base-secondary': `1px solid @border-color-base-secondary`,

            'border-radius-base': `10px`,
            'border-radius-sm': `6px`,

            'font-size-huge': `18px`, // 一级标题字体大小
            'font-size-lg': `16px`, // 二级标题字体大小
            'font-size-base': `14px`, // 正文字体大小
            'font-size-sm': `12px`, // 次文本字体大小

            'slider-gutter-huge': `20px`,
            'slider-gutter-lg': `16px`,
            'slider-gutter': `12px`,
            'slider-gutter-sm': `8px`,
            'slider-gutter-xs': `4px`,
          },
          javascriptEnabled: true,
        },
      },
    },
    sourceMap: true,
  },

  devServer: {},
  outputDir: undefined,
  runtimeCompiler: true,
  productionSourceMap: false,
  parallel: undefined,
}