FontAwesomeIcon React组件不接受icon属性。

Question

由于Font Awesome库的原因，我无法构建React项目。

到目前为止，我一直使用带有<FontAwesomeIcon icon={faPowerOff} />语法的图标，但是在尝试在Github上实现自动化构建和部署后，我遇到了以下错误：

Type 'IconDefinition' is not assignable to type 'IconProp'.
  Type 'IconDefinition' is not assignable to type 'IconLookup'.
     Types of property 'iconName' are incompatible.

这个语法和错误一起使用时，图标确实会被渲染。 使用<FontAwesomeIcon icon={"power-off"} />语法时，我不再遇到错误，但是图标本身根本没有被渲染。

我从项目开始使用的版本：

├── @fortawesome/fontawesome-svg-core@1.3.0
├── @fortawesome/free-solid-svg-icons@5.15.4 
├── @fortawesome/react-fontawesome@0.1.17

有人知道如何修复这个问题吗？

- Daniel Nýdrle

Answer 1

表现异常

在他们的网站上，他们在React中使用图标，像这样：

<FontAwesomeIcon icon="fa-solid fa-1" />

但是对我来说它没有起作用。

---

这也不能在更新的npm包版本中使用：

<FontAwesomeIcon icon={"fa-1"} />

现在我正在使用这个，它运行得很好：

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

<FontAwesomeIcon icon={fa1} />

我正在使用的版本是：

"@fortawesome/fontawesome-svg-core": "^6.2.1",
"@fortawesome/free-regular-svg-icons": "^6.2.1",
"@fortawesome/free-solid-svg-icons": "^6.2.1",
"@fortawesome/react-fontawesome": "^0.2.0",

- Amel

Answer 2

我通过将fontawesome-svg-core和react-fontawesome软件包降级到以下版本来解决了这个问题：

├── @fortawesome/fontawesome-svg-core@1.2.36
├── @fortawesome/react-fontawesome@0.1.16

- Daniel Nýdrle