在vue項目中引入阿里圖標庫小記


使用Vue技術棧開發不僅效率高,而且很友好,而且還有很多基於vue的UI框架,例如:element等,但是這類框架美中不足的是,圖標太少。為了解決這個問題,不得不引入第三方字體庫,今天以阿里圖標庫為例,如何在vue中使用。

1、首先找到合適圖標,然后點擊添加入庫,接着點擊右上角的購物車圖標。

2、你剛才選擇的圖標就能在側邊欄看到了,選擇要加入的項目(提前建好的項目),點擊確定。

3、進入我的項目頁面,就能看到所有選擇好的圖標,點擊下載至本地按鈕。

4、文件解壓后,將所有文件復制到如下目錄。

5、在main.js文件里引入iconfont.css。

 

 6、現在就可以在項目中引入圖標了。必須添加iconfont類,然后再添加圖標名字作為類名。

<i class="iconfont icontuding"></i>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM