注册步骤在vscode中必须先注册好。然后下载svg的图片才能使用

1.在components中弄一个组件，这个组件是要陪注册成全局组件使用的

image.png
image.png

在icons文件夹下的index.js把这个组件注册成全局组件

image.png
image.png
image.png

2.在main.js中导入icons文件夹

image.png
image.png

在vue.config.js中导入下面的代码

image.png

  1.  config.module
  2.       .rule('svg')
  3.       .exclude.add(resolve('src/icons'))
  4.       .end()
  5.     config.module
  6.       .rule('icons')
  7.       .test(/\.svg$/)
  8.       .include.add(resolve('src/icons'))
  9.       .end()
  10.       .use('svg-sprite-loader')
  11.       .loader('svg-sprite-loader')
  12.       .options({
  13.         symbolId: 'icon-[name]'
  14.       })
  15.       .end()

如下图搭建svg图片的步骤，就是上面的步骤总结

image.png

https://www.iconfont.cn/home/index?spm=a313x.7781069.1998910419.2（在这svg图标的网址）
使用步骤1
image.png
image.png

image.png
image.png