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 use social/brand icons in React（并且不是重复的）。

但是我不想导入特定的对象，因为我的用户应该能够使用任何图标，并且图标已在模型中指定。

还不清楚这些图标如何工作。

Answer 1

我必须将导入更改为：

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

并添加以下代码：

library.add(fab);

这些更改之后，一切开始起作用。

Fontawesome 5 React Brand图标不起作用-如何解决？

1 个答案: