在開發前端項目中，字體圖標變得越來越常用。一方面因為它比圖片使用起來方便，可以像字體一樣修改大小和顏色；另一方面是因為它可以減少請求數量，優化前端性能。
iconfont的使用方法很簡單，主要由三種引入方式：Unicode， Font Class，Symbol。不會的可以去官網看看：https://www.iconfont.cn/
但是在實際項目中，我們可能會遇到iconfont沖突的問題，簡單來說就是某個項目存在多個iconfont資源目錄，而且命名沒有修改（默認名都是"iconfont"）。導致在頁面加載時無法確定使用哪個資源目錄下的圖標，就會顯示不出來。
舉個我實際項目中的例子（由於瀏覽器的限制，我使用的是font class方法）：在開發項目A時，我在assets目錄里，新建一個iconfont文件夾用來存儲該項目中需要用到的iconfont資源；由於需求我需要開發一套通用UI組件，考慮到插件的獨立性和移植性，我想把該組件與項目解耦，包括資源，方法等。於是我在components目錄下新建一個目錄componentA,里面由獨立的assets,function目錄。由於iconfont都是從官網直接下載，沒有修改，導致這兩個資源的命名都是"iconfont"，導致組件中iconfont始終都加載不出來。
原因：字體命名沖突，樣式命名沖突，導致字體圖標顯示不出來。由於兩個地方的iconfont.css文件中的字體命名都是"iconfont"，而且樣式命名也是相同的，導致問題的出現。
解決辦法：既然明確了問題的原因，只要修改其中一個文件的命名就好了，如下圖。
修改好iconfont.css文件后，引用的地方也需要修改。如下圖：
重新運行項目，組件中和項目中的iconfont都可以正常顯示。