安装

1
npm install svg-sprite-loader --save-dev

配置

在 Vue.config.js 中加入如下配置:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
const path = require('path')

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

module.exports = {
chainWebpack: config => {
// 删除默认配置中处理svg
config.module.rules.delete('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: '[name]'
})
}
}

当然其他的 webpack 配置也可以在 Vue.config.js 中配置,包括反向代理等等。具体可查看这里

参考文章