vue项目中使用阿里icon库

  1. 从阿里字体图标库新建一个项目(当然也可选择其他icon库)
    vue项目中使用阿里icon库
    注意:Font class前缀不要和elment-ui中的图标前缀一样
    2.选择需要的图标添加至项目,并生成Font class,下载至本地。
    3.选择解压后的文件中的iconfont.css , iconfont.eot , iconfont.svg , iconfont.ttf , iconfont.woff复制到自己的项目中对应的路径下,并在main.js中通过import全局引入,只需要引入iconfont.css即可。vue项目中使用阿里icon库
    4 修改iconfont.css中的.iconfont选择器,改为属性选择器[class^="el-xxx"],[class*="el-xxx"]创建项目时设置字体icon前缀,如图:vue项目中使用阿里icon库
    5 在组建中即可通过<i class="el-ico-x-id-card"></i>使用。