React项目中使用Font Awesome

要想在前端项目中使用图标，按原来的写法，就是先去官网下个包，然后link引入到页面，然后再使用。但发现npm中竟有@fortawesome/react-fontawesome可以直接用，不禁大喜过望，现将使用流程总结如下：

首先是要用npm把组件相关都安装一下：

$ npm i --save @fortawesome/fontawesome-svg-core
$ npm i --save @fortawesome/free-solid-svg-icons
$ npm i --save @fortawesome/react-fontawesome

另外一些常用图标：

$ npm i --save @fortawesome/free-brands-svg-icons
$ npm i --save @fortawesome/free-regular-svg-icons

显然，我这里安装的图标都是穷人版，如果你是设计大佬，可以付费下载带pro的包。

此时，安装的包就已经达到我的需求了，比如我要一个问号，首先引入：

import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faQuestionCircle } from '@fortawesome/free-regular-svg-icons'

然后在代码中：

<FontAwesomeIcon icon={faQuestionCircle} />

问号图标就会显示到页面上了。