无法在Reactjs项目中导入font-awesome

Question

我想在我的Reactjs项目中使用font-awesome，但我导入它有问题。

安装好了

npm install --save font-awesome

在我的index.js文件中导入它

import '../node_modules/font-awesome/css/font-awesome.min.css'; 

webpack.config.js

在我的webpack中添加了加载程序

{
  test: /font-awesome\.config\.js/,
  use: [
        { loader: 'style-loader' },
        { loader: 'font-awesome-loader' }
       ]
}

然后尝试在我的代码中使用它

<a href="#about" class="btn btn-circle page-scroll">
<i class="fa fa-angle-double-down animated"></i>

但是我收到了这个错误：

You may need an appropriate loader to handle this file type.

我应该使用什么装载机而不是我做的装载机？

Answer 1

使用Font Awesome的React implementation：

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

...

render() {
  return (
    <FontAwesomeIcon icon={faAngleDoubleDown} pulse />
  )
}

您可以使用添加pulse或spin布尔道具的所需动画。