无法在Reactjs项目中导入超棒的字体

时间:2018-09-10 15:58:29

标签: reactjs font-awesome

我正在我的Reactjs项目中尝试使用 dotnet xdt --source .\web.config.full --transform .\web.dev.config --output .\web.config ,但导入时遇到问题。

已安装

font-awesome

将其导入到我的index.js文件中

npm install --save font-awesome

webpack.config.js

已将加载程序添加到我的webpack

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

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

{
  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>

我应该使用哪种装载器而不是我使用的装载器?

1 个答案:

答案 0 :(得分:1)

使用FontAwsome的React implementation

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

...

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

您可以通过添加pulsespin布尔属性来使用所需的动画。