1. 程式人生 > >react 中引入 fontawesome 字體包。free-brands-svg 引入的使用問題

react 中引入 fontawesome 字體包。free-brands-svg 引入的使用問題

ons image class rar index fort https apt add

技術分享圖片

技術分享圖片

技術分享圖片

以上就是具體的代碼;

使用步驟是:

首先   npm i --save  @fortawesome/free-solid-svg-icons@prerelease

            @fortawesome/fontawesome-svg-core@prerelease             @fortawesome/react-fontawesome@prerelease             @fortawesome/free-brands-svg-icons@prerelease 然後在 index.js 引入   
import { library } from ‘@fortawesome/fontawesome-svg-core‘;
import {
    faTachometerAlt,
    faAngleLeft,
    faAngleDown,
    faWifi,
    faUmbrella,
    faTasks,
    faLaptop
} from 
‘@fortawesome/free-solid-svg-icons‘; import { fab} from "@fortawesome/free-brands-svg-icons";//商標元素 則需要添加前綴 library.add( faTachometerAlt, faAngleLeft, faAngleDown, faWifi, fab, faUmbrella, faTasks, faLaptop )

在 其它組件中調用

import { FontAwesomeIcon } from ‘@fortawesome/react-fontawesome‘;
  <FontAwesomeIcon icon="angle-left" className={Appcss.iconright} />
使用fab 商標元素的時候添加前綴
 <FontAwesomeIcon icon={["fab","apple"]} className={Appcss.iconright} />                                                                                                      

看不明白的同學也可以上這裏看 https://reactjsexample.com/official-react-component-for-font-awesome-5/

react 中引入 fontawesome 字體包。free-brands-svg 引入的使用問題