vue项目引入阿里巴巴矢量图标库步骤详解
第一步打开百度搜索阿里巴巴矢量图标库
官方网址:/
第二步在搜索框搜索你想要的图标点击购物车图标 或者直接下载png或者jpg图标(这种是图片方式引入);
第三步点开右上角的购物车按钮
第四步会出现一个右侧抽屉点击添加至项目(需要登录,按照自己喜欢的登录方式进行登录)
第五步点击下载至本地下面是你原来或者刚才选的icon图标
第六步,在vue项目中解压刚才的文件放入vue的静态资源库里
第七步在main点js中引入(路径要找到解压文件下的iconfont.css文件)
import '../static/font_icon/iconfont.css'
第八步解压文件下有一个demo_index.html文件可以查看你现在的图标和命名
这是相对应的类名然后
在代码中加上上面图标的类名就可以出来所下载的图标了
注意:所有的类名前面都需要加上iconfont后面拼上你需要icon的类名就ok了
<span class="iconfont icon-xxx"></span>
