iconfont在react中完整使用教程

hello,各位小夥伴們,好久沒寫文章了。
忽然要本身搭建項目了,項目中對於阿里巴巴iconfont的使用,你們都清楚嗎?javascript

第一步:將圖標加入購物車css

clipboard.png

第二步:將圖標下載到本地,將以下文件放置在react項目中assets目錄下html

clipboard.png

clipboard.png

clipboard.png

第三步:導入iconfont.css到項目目錄,鄙人踩坑點在此。
查閱部分文件,找到相關資料,發現是在純html頁面中導入是徹底OK的。
<link rel="stylesheet" type="text/css" href="iconfont.css">
可是請注意,我們將靜態資源放置在src目錄下,public中的index.html不可採用。
因而,正確作法以下:
在src文件下的index.js或者app.js等文件中寫入以下語句便可。
import './assets/fonts/iconfont.css';java

第四步:介紹使用方法react

unicode: <i className="iconfont">&#xe72e;</i>
font-class:<i class="iconfont icon-gouwuche"></i>
symbol:待我研究去吧。。。

備註:
若是發現頁面沒有更新,能夠重啓一下服務。
以上就是關於iconfont的介紹了,你們能夠踊躍查閱資料,在此但願可以給到小夥伴們一些幫助呀!app

相關文章
相關標籤/搜索