FontAwesome为什么图标以SVG格式呈现？

Question

在我的Angular5项目中，我使用FontAwesome图标：静态图标和微调器。 我运行了npm install font-awesome并安装了4.7.0版本。

"dependencies": {
  ....
  "font-awesome": "4.7.0"
}

在我的app.component.html

中

<div class="center">
  <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
  <p>Loading...</p>
</div>

但是我在chrome控制台中看到的是：

旋转器没有正确的脉冲式动画。

如果我使用静态字体真棒图标，它也会呈现为SVG。为什么？

Answer 1

因为您将包用作依赖项，所以基于文档是正常的：https://fontawesome.com/how-to-use/svg-with-js

  

我们全新的基于SVG的框架，为您提供在网络上使用SVG图标的所有好处，而不会有任何麻烦。我们保持语法和步骤简单，并构建了用于调整大小，放置和样式的工具。

如果您想以不同的方式使用它，我会将其添加为css / sass文件中的字体或：

<link rel="stylesheet" href="https://use.fontawesome.com/releases/vX.XX.XX/css/all.css"

文档：https://fontawesome.com/get-started/web-fonts-with-css

而不是js库：https://fontawesome.com/get-started/svg-with-js