阿里巴巴矢量图标库地址为：https://www.iconfont.cn/
项目中还是有很多需要用到图标的地方，除了美工设计的图标外，一般我都会从这上边搜索好看的图标，在项目中使用
第一步，输入地址https://www.iconfont.cn/，进入到阿里巴巴矢量图标库

第二步，登录账号，没有账号的注册一个就行。
第三步，在上方的搜索框中输入自己需要查找的图标，比如我想要查找有关地图定位点相关的图标，直接在输入框中搜索坐标即可，下方就会自动筛选出有关坐标的图标，并在界面下方展示出来。

第四步：选择自己需要的图标，鼠标悬浮在图标上方，点击第一个购物车的小图标，添加入库

第五步：点击右上方的购物车小图标，会在右侧弹出加购物车里图标的列表

第六步，依次点击，将图标添加在自己的项目中

说明：如果没有项目的，可以新创建一个项目，在【资源管理】中，选择【我的项目】，然后点击页面右侧的新建项目按钮，完善项目的相关属性信息，最后点击新建即可，相关操作步骤如下图所示：


第七步：在【我的项目】中，找到需要引入的项目，点击下载到本地，会在本地下载一个zip压缩包，选择后路径后，直接下载即可。

第八步：将下载好的zip压缩包，解压后，将这些文件移动到vue所管理的项目中，可以在assets下新建一个font文件夹

第九步：更改iconfont.css中的红框地方的信息，将.iconfont更改成以下格式

[class^="iconfont"],[class*="iconfont"]

第十步：需要在main.js中，引入字体图标。

import './assets/font/iconfont.css'

第十一步：在.vue的文件中使用图标

<i class="iconfont icon-gonggongziyuanjiaoyi"></i>

其中，icon-gonggongziyuanjiaoyi表示你需要使用图标的class名称，相关名称可以在图标库中查看，直接复制代码即可。

也可以在代码中动态配置展示的图标，灵活性更高。