React App 中未顯示 FontAwesome 5 圖標

Question

我在 React App 和 TypesScript（使用 react-react-app 創建）中使用 FontAwesome，但圖標尚未顯示，我一步一步按照文檔的指南進行操作。

全局導入圖標 (index.tsx)

import { library } from '@fortawesome/fontawesome-svg-core';
import { faCheckSquare, faCoffee } from '@fortawesome/free-solid-svg-icons';

library.add(faCheckSquare, faCoffee);

使用我的組件中的圖標

import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';

export const Home = ()=> {
return  <FontAwesomeIcon icon='coffee' size='lg'/>
}

怎么了？

下面的屏幕截圖顯示了該圖標應該在查看價格變化旁邊的位置，但它不可見。 我究竟做錯了什么？ 提前致謝。

Answer 1

很可能沒有添加 font-awesome 的 Css 嘗試將其添加到您的 index.html 文件中。

<head>
<meta charset="UTF-8">    
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-
awesome.min.css" rel="stylesheet" integrity="sha384-
wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" 
crossorigin="anonymous">
</head>

React App 中未顯示 FontAwesome 5 圖標

問題描述

1 個解決方案

解決方案1
0 2022-01-06 10:42:01

React App 中未顯示 FontAwesome 5 圖標

問題描述

1 個解決方案

解決方案1 0 2022-01-06 10:42:01

解決方案1
0 2022-01-06 10:42:01