react使用字型圖示iconfont

1. 第一步，進入到iconfont官網，選擇圖示管理進入我的項目，點選右上角的+号建立自己的項目；

   

2. 建立完項目後可以去搜尋自己想要的的圖示，然後點選添加至購物車；

1. 點選左上角的購物車就可以看見自己的圖示，然後點選将圖示加入自己的項目。

   

2. 到我的項目下載下傳圖示至本地并解壓，選擇其中這幾個檔案

   

3. 将這幾個檔案放到自己項目中的statics檔案夾中，打開iconfont.js 檔案夾删掉裡面的其他東西，然後利用react的styled-components插件引入圖示，首先是先下載下傳依賴

   npm install --save styled-components

   依賴安裝完成之後在icon font中引入并使用

   

   然後修改其中的font-face中的一些内容，将url和src的路徑改為相對路徑，

   删除下面的iconfont圖示css。

   

4. 然後在項目的入口檔案引用

   

5. 最後使用

<i className='iconfont'>&#xe62a;</i>  
           

補充，可以打開下載下傳的檔案中的index.html檔案擷取