Angular 8库中的依赖项问题

Question

我遇到了Angular的一个奇怪问题，我为一个项目创建了一个新库，该项目具有两个对等项：Bootstrap和Fontawesome 5。 Bootstrap导入的工作方式就像一个超级按钮，但是FontAwesome不会在html视图中显示适当的图标。

• 已尝试在主项目中重新安装软件包
• 在库的scss中设置文件路径
• 还尝试对图标使用单独的导入

库文件：

HTML：

<div class="container-fluid">
    <div class="row">
        <div class="col-sm-12 col-md-4 col-lg-3 dragdrop-area">
            <i class="fas fa-file-upload"></i>
            <i class="fas fa-cloud-upload-alt fa-2x"></i>
            Drag'n'Drop area
        </div>
    </div>
</div>

SCSS（带有导入）：

@import '../../../../node_modules/@fortawesome/fontawesome-free/css/all';
// tried to
// @import '../../../../node_modules/@fortawesome/fontawesome-free/scss/fontawesome';
//@import '../../../../node_modules/@fortawesome/fontawesome-free/scss/solid';
//@import '../../../../node_modules/@fortawesome/fontawesome-free/scss/regular';
@import '../../../../node_modules/bootstrap/scss/bootstrap';

Angular.json（带有我的库的项目）

"styles": [
"node_modules/fortawesome/fontawesome-free/css/all.css",
"node_modules/bootstrap/dist/css/bootstrap.min.css",
"src/styles.scss"
]