Fontawesome 5 React 品牌圖標不起作用 - 如何解決？

Question

import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import '@fortawesome/fontawesome-free-solid';
import '@fortawesome/free-brands-svg-icons';

在渲染代碼中：

<FontAwesomeIcon icon={'facebook'} />

<FontAwesomeIcon icon={['fab','facebook']} />

<FontAwesomeIcon icon={['fab','facebook-f']} />

沒有任何效果。 我有以下錯誤：

backend.js:6 Could not find icon {prefix: "fab", iconName: "facebook"} 
    in FontAwesomeIcon (created by MyView)
    in DashboardView (created by Router.Consumer)
    in Router.Consumer (created by Route)
    in Route

我錯過了什么？

我看到有人建議導入特定對象，例如-

import { faFacebookF } from '@fortawesome/free-brands-svg-icons'

從這里Font Awesome 5 在 React 中使用社交/品牌圖標（它不是重復的）。

但我不想導入特定對象，因為我的用戶應該能夠使用任何圖標，並且它在 model 中指定。

目前還不清楚這些圖標是如何工作的。

Answer 1

我不得不將導入更改為：

import { library } from '@fortawesome/fontawesome-svg-core';
import { fab } from '@fortawesome/free-brands-svg-icons';

並添加以下代碼：

library.add(fab);

在這些更改之后，一切都開始工作了。