按照现有的网上方案会报错:
Syntax Error: Error: Plugin name should be specified
意思就是:需要配置一个插件名字,想看官网的去这里:https://github.com/svg/svgo
上个图:
不多说了上代码:
chainWebpack: config => {
config.resolve.alias.set('@$', resolve('src'))
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]'
})
.end()
.before('svg-sprite-loader')
.use('svgo-loader')
.loader('svgo-loader')
.options({
plugins: [
//!!!!!!!!!!!!!!!重点就是改这个位置,加个插件名字
{
name: 'removeAttrs',
params: {
attrs: '(fill|stroke)'
}
}
]
})
.end()
},
错误的代码也贴下吧,大家可以参考是不是和自己的一样以防解决不了
chainWebpack: config => {
config.resolve.alias.set('@$', resolve('src'))
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]',
fill: ''
})
.end()
.before('svg-sprite-loader')
.use('svgo-loader')
.loader('svgo-loader')
.options({
//!!!!!!!!!!!!!!!这个配置会报错
plugins: [
{removeAttrs: {attrs: "path:fill"}}
]
})
.end()
},
网友评论