https://www.iconfont.cn/manage/index找到阿里图标库
创建新项目
新建项目------创建----
1)、FontClass/Symbol前缀这个很重要,一定不要写成:el-icon-***这样的形式。
如果写成这样的前缀,会和element-ui框架所带的图标(icon)冲突,导致你图标显示不出来
2)、fontFamily随便起一个名字,能记住就行
3)、项目创建完了,你可以往项目里面添加自己想要的图标了, 找到想要的图标添加到购物车,可以通过浏览或者搜索找到自己想要的图标,然后添加到自己的项目,这里有一个坑,千万要记住自己是哪个项目要用,不然弄混麻烦很大,比如我随意找了些图标添加到了我的项目。
---------------------
最后在代码中引用,这里采取的是第二种方式:
内联样式加个class 表示,这里有坑二, 记得要加上自己的 FontClass/Symbol前缀 ,不然显示的是小方块,不会报错,再加上这个图标自己的名字,就大功告成。
<i class="icon iconfont travel-gouwucheman"></i>
也可以采用Unicode的方法,不用图标名字,span 标签内插入 图标的Unicode码
就是类似  这样的东西,记得加上分号,不然。。。。。 还有把图标名字去掉
跟第一种差不多,不过个人觉得第一种更好理解。看个人喜好。
引入字体文件后,要重启一下服务 -----> npm run dev 或者 npm run start
如果按照步骤来还是出现小方块,一定先检查自己的每一步是否正确,还是不行,可以试着改一下旧文件的base64 编码换成新的。或者打开 历览器调试的 networks 看看字体文件有没有加载。
---------------------