示例: https://cenkai88.github.io/vue-svg-icon/demo/

项目地址: https://github.com/cenkai88/vue-svg-icon 求star～～
个人的第一个vue组件，希望大家多多支持啦～😄
基于vue-awesome扩展而来
其实想到写这个的原因主要是在开发中常常需要用到图标，这一块经历了四个阶段。

用的awesomeFont之类的库
发现iconfont之后，每用到一个图标就去搜一个加入到工程中，自定义程度更高，也减少图标引入。
从iconfont下了图标之后用illustrator编辑形状或者颜色之后达到更高的定制性。
在写这个组件之前，发现SVG图片其实就是XML格式的标签，其中fill属性六位颜色值的路径会根据值渲染颜色，而fill为空的可被HTML中该SVG节点css3的color 属性控制，这样的话我们可以为图标赋予两种状态。

组件特点:

wechat.jpg

alipay.jpg

demo.gif

npm install vue-svg-icon --save-dev

这里安利一个svg图片库iconfont

import Icon from 'vue-svg-icon/Icon.vue';Vue.component('icon', Icon);
Icon.inject('chameleon'); // SVG图片名字（无扩展名）

<icon name="chameleon" scale="20"></icon>

在illustrator中编辑svg图片时

如果你读到这了，那么这个插件八成适合你，请移步vue-svg-icon

本文对你有帮助？欢迎扫码加入前端学习小组微信群：