vue.config.js

const path = require('path')

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

module.exports = {

    publicPath: process.env.NODE_ENV === 'production' ? './' : './',
    lintOnSave:false,
    css:{
        loaderOptions:{
            postcss:{
                plugins: [
                    require("autoprefixer")({
                      // 配置使用 autoprefixer
                      overrideBrowserslist: ["last 15 versions"] 
                    }),
                    require("postcss-pxtorem")({
                      rootValue: 37.5, // 换算的基数
                      // 忽略转换正则匹配项。插件会转化所有的样式的px。比如引入了三方UI，也会被转化。目前我使用 selectorBlackList字段，来过滤
                      //如果个别地方不想转化px。可以简单的使用大写的 PX 或 Px 。
                      selectorBlackList: ["ig"],
                      propList: ["*"],
                      exclude: /node_modules/
                    })
                  ]
            }
        }
    },
    devServer:{
      port:8080,
      open:true
    },
    chainWebpack: config => {
      config.module.rules.delete("svg"); //重点:删除默认配置中处理svg,
      config.module
        .rule('svg-sprite-loader')
        .test(/\.svg$/)
        .include
        .add(resolve('src/icons')) //处理svg目录
        .end()
        .use('svg-sprite-loader')
        .loader('svg-sprite-loader')
        .options({
          symbolId: 'icon-[name]'
        })
    },
    // pluginOptions: {
    //     'style-resources-loader': {
    //         preProcessor: 'sass',
    //         patterns: [
    //             path.resolve(__dirname, './src/assets/styles/*.scss')      //你的.scss文件所在目录
    //         ]
    //     }
    // }
}