vue ElementUI引入第三方icon

1、訪問 阿里巴巴矢量圖標庫，註冊

2、新建項目：

 

3、在圖標庫選擇需要的圖標加入購物車：

 

4、將購物車選好的圖標加入到項目：

5、選擇圖標類型爲Font class，下載到本地：

6、解壓下載文件，拷貝到項目中：

 

demo文件不用拷貝。目錄爲src/asserts/icon文件夾：

7、在iconfont.css文件中加入代碼：

[class^="icon-third"], [class*=" icon-third"] {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

如下圖所示： 

 

8、main.js中加入：

import './assets/icon/iconfont.css';

9、使用：

<el-button size="mini" type="primary" icon="icon-third-Customermanagement-fill"> </el-button>