带有反应的字体真棒 5.13.0答案

【问题标题】：Font-awesome 5.13.0 with react带有反应的字体真棒 5.13.0
【发布时间】：2020-09-12 15:30:49
【问题描述】：

我正在尝试在 react.js 应用程序中使用 Font-Awesome 5.13.0，有没有办法使用这样的图标：

<i className="fas fa-tachometer-alt fa-fw "></i>

而不是使用“官方反应方式”，例如：

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

<FontAwesomeIcon icon={faHome} />

提前致谢。

【问题讨论】：

包含 CDN 就完成了<script src="https://use.fontawesome.com/releases/v5.13.0/js/all.js"></script>
@TemaniAfif 我需要通过 npm 安装什么吗？或者只是添加脚本
只需添加脚本
@TemaniAfif 非常感谢，这是最简单的解决方案，它有效

标签： css reactjs font-awesome

【解决方案1】：

你可以从像https://www.bootstrapcdn.com/fontawesome/这样的CDN热链接css（记得配置CSP）

另一种选择是从节点模块导入 Font Awesome css

import '../node_modules/@fortawesome/fontawesome-free/css/all.css';

您需要将构建工具配置为加载 sass/css 文件，就像 webpack 一样

{
    test: /\.(sass|scss|css)$/,
    use: ['style-loader','css-loader','sass-loader']
},

您需要将构建工具配置为加载字体文件，就像 webpack 一样

{
    test: /\.(svg|eot|woff|woff2|ttf)$/,
    use: ['file-loader']
}

【讨论】：