我在哪里可以找到 FontAwesome 免费包中图标的对象名称？

Question

FontAwesome is a collection of libraries of icons. In their Usage documentation，他们写了一个例子，你可以通过从 free-solid-svg-icons 包中导入咖啡图标的对象来使用他们的咖啡图标，就像这样：

import ReactDOM from 'react-dom'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faCoffee } from '@fortawesome/free-solid-svg-icons'
 
const element = <FontAwesomeIcon icon={faCoffee} />
 
ReactDOM.render(element, document.body)

正在查看 FontAwesome Coffee Icon documentation, I can see no reference to what package the coffee icon is included in, or what its object name is. We know from the example code that its object name is faCoffee and that it's included in the @fortawesome/free-solid-svg-icons package, but what about any of the other 5,365 icons?

问：如何找到 FontAwesome 图标具有的 React 对象名称，以及它包含在哪个 React 包中？

Answer 1

Font-Awesome中只有4个包:

Name    | Free | Paid | Prefix | NPM Package (free)                  | NPM package (paid)
---------------------------------------------------------------------------------------------------------
Solid   | Yes  | Yes  | fas    | @fortawesome/free-solid-svg-icons   | @fortawesome/pro-solid-svg-icons
Regular | Yes  | Yes  | far    | @fortawesome/free-regular-svg-icons | @fortawesome/pro-regular-svg-icons
Light   | No   | Yes  | fal    |                                     | @fortawesome/pro-light-svg-icons
Brands  | Yes  | No   | fab    | @fortawesome/free-brands-svg-icons  |

在Search icons page you can filter them by package so you know what icons belongs to what package; As an example the following link gives icons filtered by Solid package.

也就是说，从您发布的代码中，您可以从图标列表中扣除添加前缀 "fa" 的图标的 React 名称； React 中的图标 "Coffee" 是 "faCoffee".

并且从过滤后的 link 你应该能够找到哪些图标属于哪个包。

Answer 2

我更喜欢深入研究 Github 中的代码。即这个文件https://github.com/FortAwesome/Font-Awesome/tree/master/js-packages/%40fortawesome/free-regular-svg-icons

这包括文件名，例如。 faAddressBook.d.ts 作为 TS 声明，但可以很好地指示存在的内容和不存在的内容。

我在哪里可以找到 FontAwesome 免费包中图标的对象名称？

Where do I find the object names of icons in the FontAwesome free packages?

reactjs

font-awesome-5