Angular CLI 8.2.2 中未显示主题化图标答案

【问题标题】：Themify icons not showing in Angular CLI 8.2.2Angular CLI 8.2.2 中未显示主题化图标
【发布时间】：2019-08-28 07:14:20
【问题描述】：

我已经通过 npm npm install --save @icon/themify-icons 从 https://www.npmjs.com/package/@icon/themify-icons 安装了 Themify。我使用这种方法将图像插入网站

<img height="32" width="32" src="@icon/themify-icons/icons/arrow-up.svg"/>

并显示损坏的图像。当我像这样使用远程 CDN 时

<img height="32" width="32" src="https://unpkg.com/@icon/themify-icons/icons/arrow-up.svg" />

显示没有问题。但我不想使用远程 CDN。

当我使用这种方法在本地的 head 标记中或在 index.html 中使用远程 CDN 插入样式表时：

<link rel="stylesheet" href="@icon/themify-icons/themify-icons.css">

<link rel="stylesheet" href="https://unpkg.com/@icon/themify-icons/themify-icons.css">

并在 app.component.html 中插入标签：

<i class="ti ti-arrow-up"></i>

不工作。显示的是正方形而不是图标。

有人可以帮忙吗？

【问题讨论】：

标签： angular npm webpack

【解决方案1】：

在 index.html 文件中导入 CDN 下方。

<link rel="stylesheet" href="@icon/themify-icons/themify-icons.css">
<link rel="stylesheet" href="https://unpkg.com/@icon/themify-icons/themify-icons.css">

在您的模板（html）文件中添加此链接

 <i class="ti ti-arrow-up"></i>

【讨论】：

正如我在上面已经写过的，不幸的是无法正常工作。显示正方形。
我在代码检查器中发现了它:)，我的 app.component.css 文件覆盖了 i 标签的样式。