網址：
vue使用小技巧之如何使用阿里巴巴矢量圖標庫
助力數字生態，雲產品優惠大促
騰訊雲促銷，1核1G 99元/1年，2核4G 1200元/3年
阿里巴巴矢量圖標庫介紹：設計師將圖標上傳到Iconfont平台，用戶可以自定義下載多種格式的icon，平台也可將圖標轉換為字體，便於前端工程師自由調整與調用。
目前擁有icon即將突破500萬。
網址：https://www.iconfont.cn
本篇文章將會為小伙伴們詳細圖解——在vue中如何使用阿里巴巴矢量圖標！
1、打開阿里巴巴矢量圖標庫網址
2、注冊並登陸（略）
3、點擊圖標管理—》我的項目，然后創建項目。
4、添加新建項目的信息
5、任意搜索一個圖標，例如“elementui”
6、在搜索結果中，請將鼠標移入到你心儀的圖標，然后點擊購物車（不愧是阿里，做什么都有種電商的味道）將你的圖標入庫！
7、入庫后，網頁右上角的購物車圖標會有紅色警示，點它！
8、然后點擊“添加至項目”。選擇好加入的項目后，點擊確定。
9、將你的圖標下載至本地。
10、下載並解壓縮的文件如下圖：
11、在文件復制到項目中（刪除demo開頭的文件），我的地址是：src/assets/iconfont
12、在main.js中引入阿里巴巴矢量圖標庫
import "@/assets/iconfont/iconfont.css";
13、樣式在iconfont.css中
.iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}.iconelementui:before { content: "\e604";}
14、使用：
<template> <div id="app"> <i class="iconfont iconelementui"></i> </div></template> <style scoped> .iconelementui { color: red; font-size: 200px; } #app { text-align: center; }</style>
15、預覽結果：
