const path = require('path') function resolve (dir){ return path.join(__dirname,dir) } module.exports = { // 选项... publicPath: './', productionSourceMap: false, css: { extract: false, sourceMap: true, loaderOptions: {}, }, lintOnSave: false, devServer: { overlay: { warning: false, errors: false }, disableHostCheck: true, }, chainWebpack: (config) => { //配置 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') //定义规则 使用时 .options({ symbolId: 'icon-[name]' }) .end() } }