如何在 Angular 中使用引导图标包

【问题标题】：How do I use the bootstrap icon package in angular如何在 Angular 中使用引导图标包
【发布时间】：2021-06-24 19:13:04
【问题描述】：

我下载了引导图标和字体超棒的软件包。但是我不知道怎么用，我只是将以下内容导入到styles.css文件中：@import "~bootstrap/dist/css/bootstrap.css"; @import "~font-awesome/css/font-awesome.css";

我想我需要在 angular.json 文件中添加一些内容，但我输入的路径不正确

我希望它看起来像这样：

但它看起来像这样：

【问题讨论】：

【解决方案1】：

$ npm i bootstrap-icons

并在 style.css 文件中添加以下行：

@import "~bootstrap-icons/font/bootstrap-icons.css";

并使用这样的图标（只是示例）：

<i class="bi bi-person-fill"></i>

您可以在以下 bootstrap 官方文档中找到您想使用的任何图标：bootstrap icons

【讨论】：

【解决方案2】：

删除./后尝试。喜欢：

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

【讨论】：