FontAwesome 未正确加载 Angular 元素

Question

我有一个 Angular 应用程序，它使用 Angular 元素打包，然后加载到另一个 Web 应用程序中。我正在使用 Font Awesome，但图标显示为方框。

类似于How to know if a font (@font-face) has already been loaded?

中描述的内容

我已经通过 npm 添加了 fontawesome。

我还添加了以下内容到我的 angular.json

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

这就是我使用 FA 的方式。

<button class="btn btn-primary btn-sm fa fa-bars">
  {{ label }}
</button>

所以我的问题是我在这里缺少什么？非常感谢任何帮助。

Answer 1

不要在 angular 项目中手动配置 font-awesome，请使用 NPM 包，它将通过几个简单的步骤自动为您配置所有内容

FontAwesome not loaded correctly with Angular elements