SCSS/SASS 中的 FontAwesome 显示正方形

Question

这个问题已经被问过好几次了，但我似乎得不到更新的答案。

我一直在尝试在我的 .scss 中加载一个很棒的字体图标，我特别遵循了这条指令 https://fontawesome.com/how-to-use/on-the-web/using-with/sass 但我仍然只是得到正方形。

这是我的代码

_fontawesome.scss

@import './scss/fontawesome.scss';
@import './scss/solid.scss';

.user {
  @extend %fa-icon;
  @extend .fas;

  &:before {
    content: fa-content($fa-var-user);
  }
}

index.js

<span className="user" />

_variables.scss

$fa-font-path:         "../webfonts" !default;

我的目录

public/
     fontawesome/
          scss/
          webfonts/
          _fontawesome.scss

如果有帮助，我正在使用它进行反应，并且我可以使用 npm 完美地将 FontAwesome 用作组件，但我有这种情况需要在 scss 中使用它。

请帮忙！谢谢！

Answer 1

你怎么不用字体真棒CDN？它非常适合我。它会让你不会厌倦它:(

类似的东西对你来说是有效的：

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/all.min.css">

我会仔细看看你的问题，但明天太晚了:p

SCSS/SASS 中的 FontAwesome 显示正方形

FontAwesome in SCSS/SASS showing squares

sass

font-awesome

reactjs

scss-mixins