美文网首页
如何在新项目使用svg-icon组件

如何在新项目使用svg-icon组件

作者: 沃德麻鸭 | 来源:发表于2021-08-12 20:29 被阅读0次

1.安装依赖   npm i svg-sprite-loader@4.1.3

2.配置 vue.config.js

找到配置的代码块

并且在这个文件中补充一个配置{  }

补充

3.复制/创建文件

①src/icon  保存图标 并且注册全局组件

全局注册组件

②组件  componets/SvgIcon/index.vue

template代码 script代码 style代码

③新建validate.js (utils/validate.js)

导出函数

复制地址:https://blog.csdn.net/weixin_60601708/article/details/119616315?spm=1001.2014.3001.5501

4.在main.js 中引用  

   import '@/icons'

5.使用

使用格式<svg-icon icon-class="文件名"/> 。这里的文件名就是在src/icons/svg下的文件名    直接写名字,不用写路径

相关文章

网友评论

      本文标题:如何在新项目使用svg-icon组件

      本文链接:https://www.haomeiwen.com/subject/tbacbltx.html