angular 项目中未显示 Fontawesome 图标

Question

我已经使用 npm install --save font-awesome

通过 npm 安装了 fontawesome

然后我将 css 添加到我的 angular.json 中，如下所示：

"styles": [
          "node_modules/bootstrap/dist/css/bootstrap.min.css",
          "node_modules/font-awesome/css/font-awesome.min.css",
          "src/styles.css"
        ],

然后我将其添加到我的 html 文件中：

<button type="button" class="btn btn-outline-primary">
    <i class="fa fa-arrow-left"></i>
  </button>

在我的网页上显示一个空按钮，我做错了什么？

Answer 1

    You can give the address in the styles.scss instead of the address in the package
    this way should work

@import "~font-awesome/css/font-awesome.min.css";

Answer 2

由于缺少字体文件而出现此问题。因此，您需要一种方法将字体文件包含在 css.

中

在您的 styles.scss 文件中添加：只需检查 node_modules 文件夹中的相对路径。

$fa-font-path : "~@fortawesome/fontawesome-free/webfonts";
@import '../node_modules/@fortawesome/fontawesome-free/scss/fontawesome';

angular 项目中未显示 Fontawesome 图标

Fontawesome icons not showing in angular project

font-awesome

angular

@import "~font-awesome/css/font-awesome.min.css";