在反应中使用字体真棒样式

Posted 2023-02-21

【中文标题】在反应中使用字体真棒样式

【英文标题】：Using font awesome styles in react

【发布时间】：2021-12-23 21:53:27

【问题描述】：

我不是前端开发人员，所以我猜这是一个新手问题。

我已经开发了我的 react 应用程序的第一个版本，我使用语义 css 我已经安装了包，然后将它导入到我的 index.js 文件中：

import 'semantic-ui-css/semantic.min.css';

这让我可以使用语义 CSS 对组件进行样式化，并且效果很好。

现在对于我的第二个版本，我想添加 fontawesome，所以我安装了所需的软件包：

npm i --save @fortawesome/react-fontawesome
npm install --save font-awesome

并在 index.js 中再次导入包

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

但是，这并没有为我的组件设置 fontawesome 类的样式：

例子：

class CardButton extends React.Component 
  render() 
    return (
      <button className="button button-primary">
        <i className="fa fa-chevron-right"></i> Find out more
      </button>
    );
  


export default CardButton;

这没有样式

【参考方案1】：

你也需要导入它，尝试导入它们，然后它肯定会工作，你错过了导入依赖项，

import 'bootstrap/dist/css/bootstrap.min.css';
import 'bootstrap/dist/css/bootstrap.css';
import 'font-awesome/css/font-awesome.min.css';