dd_pc/vue.config.js

const path = require('path')
function resolve (dir){
    return path.join(__dirname,dir)
} 
const WebpackBundleAnalyzer = require('webpack-bundle-analyzer');

module.exports = {
	// 选项...
	publicPath: './',
	
	productionSourceMap: false,
	css: {
		extract: false,
		sourceMap: true,
		loaderOptions: {},
	},
	lintOnSave: false,
	devServer: {
		overlay: {
			warning: false,
			errors: false
		},
		disableHostCheck: true,
	},
	chainWebpack: (config) => {
		// 配置可视化打包结构构成
		if (process.env.use_analyzer) {
		      config
		        .plugin('webpack-bundle-analyzer')
		        .use(WebpackBundleAnalyzer.BundleAnalyzerPlugin);
		}
		
		//配置 svg-sprite-loader
		// 第一步：让其他svg loader不要对src/icons进行操作
		config.module
		  .rule('svg')
		  .exclude.add(resolve('src/icons/svg'))//注意：路径要具体到存放的svg的路径下，不然会报错
		  .end()
		// 第二步：使用svg-sprite-loader 对 src/icons下的svg进行操作
		config.module
		  .rule('icons')
		  .test(/\.svg$/)
		  .include.add(resolve('src/icons/svg'))//注意：路径要具体到存放的svg的路径下，不然会报错
		  .end()
		  .use('svg-sprite-loader')
		  .loader('svg-sprite-loader')
		  //定义规则 使用时 <svg class="icon"> <use xlink:href="#icon-svg文件名"></use>  </svg>
		  .options({
			symbolId: 'icon-[name]'
		  })
		  .end()
	  }
}