1. 程式人生 > >VUE 引入阿裏圖標庫

VUE 引入阿裏圖標庫

進入 csharp sha png tps pan 賬戶 -s 購物車

本身項目是VUE, Element-UI項目, 所以內置Element-UI圖標庫 地址如下,

https://element.eleme.cn/#/zh-CN/component/icon 使用時:  
<span class="el-icon-setting"></span> 

  

下面是重點引入阿裏庫

3步就好。

1: 進入阿裏圖標庫網站: https://www.iconfont.cn/ 然後用github賬戶登錄

2: 搜索一個圖片加入購物車.

技術分享圖片

3:點擊 購物車, 加入項目之中, 然後下載到本地,

技術分享圖片

4: 把下載的文件丟入vue項目的 assets -> icon 文件夾裏面,

技術分享圖片 打開的內容是這樣的技術分享圖片

5: 在main.js 中引入這個文件

技術分享圖片

項目中的使用

<span class="iconfont icon-shezhi"></span>

  

VUE 引入阿裏圖標庫