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);

在这些更改之后，一切都开始工作了。