目前項目開發都是vue+element-ui模式，由於elementUI的icon圖標庫種類不多又不好看，所以基本不使用其自帶的圖標。一般都是引入第三方的圖標資源，例如：fontawesome、或者阿里巴巴的iconfont。由於fontawesome的使用，會使得會全部下載所有的圖標信息，使得項目變大，因此建議使用阿里巴巴的iconfont圖標庫。阿里巴巴矢量圖標庫地址：https://www.iconfont.cn/home/index，里面有豐富的圖標資源可選擇。
用法：
1、直接下載.png文件格式，按照圖片文件在項目中導入使用。
2、下載.svg文件，按照svg文件再項目中使用，具體使用方法參考另一篇文章：https://www.cnblogs.com/luoxuemei/p/12154835.html
3、使用阿里巴巴圖標項目管理功能，以下詳細說明具體的使用方案。
1）、選擇所需的圖標，加入購物車。
2）、在購物車中，把所需的圖標添加至項目。可新建項目或者選擇以有的項目。
對在此處新增的項目，其有默認的FontClass/Symbol和Font Family。我們可以自行修改，但是一定不要寫成：el-icon-***這樣的形式。
如果你寫成這樣的前綴，會和element-ui框架所帶的圖標（icon）沖突，導致你圖標顯示不出來。
3）、在圖標管理，我的項目目錄下，即可查看剛添加到項目中的圖標文件。
4）、點擊“下載至本地”，把所有的項目中的圖標信息下載到本地目錄，打開這個壓縮包，里面有一些文件是沒用的。留着選中的，其他沒用的可以刪除。
5）、在vue-cli、element-ui項目中，src->assets目錄下新建文件夾iconfont，用於存放下載所得的壓縮包的文件。
6）、在項目中的main.js文件，導入iconfont.css樣式，例如：import iconfont from '@/assets/iconfont/iconfont.css'
7）、在頁面中直接使用即可，例如：<i class="iconfont iconViid-icon-test2"></i>
使用標簽i，類目需要添加新增項目名稱的fontFamily，以及每個圖標的類名。
類名查看，在我的項目中，選擇symbol，即可看到每一個圖標的類名
8）、假如后續還需要添加新的圖標，那就繼續往里面添加入庫，然后需要重新下載文件，找到有用的文件，重新復制粘貼到icon文件夾里面來，一定要把之前的替換掉重新使用最新的。對項目中的圖標庫做增刪改並不會影響其類名，因此不用擔心圖標樣式找不到或者發生變化。
總結：文件下載的方式比使用svg的方法的好處是剩下代碼量，不需要先寫好svg文件的讀取配置方法。但是缺點是每次圖標庫有更新需要重新下載替換舊文件。