vue cli 4.x使用svg详解

煮饭大叔哎呀呀

2022-09-02 96 阅读1分钟

一、vue.config.js配置

chainWebpack (config) {
  config.module
    .rule('svg')
    .exclude.add(resolve('src/icons'))
    .end()
  config.module
    .rule('icons')
    .test(/.svg$/)
    .include.add(resolve('src/icons'))
    .end()
    .use('svg-sprite-loader')
    .loader('svg-sprite-loader')
    .options({
      symbolId: 'icon-[name]'
    })
    .end()
}

二、src下面建立icon文件夹存放icons资源具体可以参考vue-element-admin

三、main.js引入icon中的js文件

四、安装依赖```

svg-sprite-loader