vue引入icon图标库的方法

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码

就是类似 &#xe632; 这样的东西，记得加上分号，不然。。。。。  还有把图标名字去掉

跟第一种差不多，不过个人觉得第一种更好理解。看个人喜好。

引入字体文件后，要重启一下服务 ----->  npm run dev  或者  npm run start 

如果按照步骤来还是出现小方块，一定先检查自己的每一步是否正确，还是不行，可以试着改一下旧文件的base64 编码换成新的。或者打开 历览器调试的 networks 看看字体文件有没有加载。
---------------------