在vue項目中使用阿里矢量庫

阿里矢量庫使用方法簡易教程

寫在前面：以前項目是本身寫的項目來練手，因此用的矢量庫。工做裏面若是UI不用的話也只能用其餘方法了。咱們目前用的SVG,你們的項目裏面都用的是那種形式呢？

一： 在阿里矢量庫中註冊帳號

這個首頁的登陸頁面，通常用github登陸就好啦！

二：登陸後如何添加本身的項目

登陸之後就能夠看到這個頁面啦！點擊下圖的圖標管理

01 能夠申請一個本身的項目 點擊紫色的按鈕便可看到下面的頁面

02 完善相應的信息就能夠有本身的項目了。在首頁搜索你須要的圖標，例如:收藏

03 點擊相應的圖標，加入到庫中，點擊購物車的圖標能夠下載或者添加到本身項目中。若是想加載的快點，就能夠直接下載到本地。

04 到購物車裏面就能夠選擇相應的圖標到本身的項目中，點擊確認就會跳轉頁面到你的項目。新增的圖標就出現了。

05 點擊生成最新的icon

三：若是在項目中引入和使用icon

在點擊生成font class 生成一段地址 。在index.html中加入
<link rel="stylesheet" href="你複製的地址">

在項目中，你就可使用i標籤來用了。這是我項目中是使用icon的方法啦。在class裏要加入你在建項目時候自定義的前綴，eg:iconfont
在class中增長在font class下面圖標的名字：
<i class="iconfont shoucang"></i>