ruby-on-rails - Rails、Webpack 和 FontAwesome，如何停止转换为 SVG？

Question

我已将带有 Yarn 的 FontAwesome pro 添加到我的 Rails 6 应用程序中，并将其添加到 application.js 中，如下所示：

import "@fortawesome/fontawesome-pro/js/all";
import "@fortawesome/fontawesome-pro/css/all.css";

之前（通过资产管道使用 FontAwesome 时）生成的 HTML 如下所示：

<i class="fal fa-heart-rate"></i>

现在它是这样的：

<svg class="svg-inline--fa fa-heart-rate fa-w-20" aria-hidden="true" focusable="false" data-prefix="fal" data-icon="heart-rate" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512" data-fa-i2svg=""><path fill="currentColor" d="M480 224c-6.53 0-12.44 3.98-14.84 10.06l-45.62 114.05-84-335.98C333.72 4.86 327.69.17 319.62 0c-7.5.19-13.84 5.53-15.31 12.86l-82.06 410.23-46.72-186.97A16.005 16.005 0 0 0 160 224H8c-4.42 0-8 3.58-8 8v16c0 4.42 3.58 8 8 8h139.5l60.97 243.88c1.78 7.14 8.22 12.12 15.53 12.12h.38c7.5-.19 13.84-5.53 15.31-12.86l82.06-410.23 78.72 314.97c1.69 6.73 7.53 11.62 14.44 12.09 7.62.28 13.38-3.59 15.94-10.03l60-149.94H632c4.42 0 8-3.58 8-8v-16c0-4.42-3.58-8-8-8H480z"></path></svg>

有没有办法防止这种情况？我问是因为我堆叠了以前完美运行的图标，现在它不再正确显示了。

标签： ruby-on-railsfont-awesome

Answer 1

显然解决方案很简单。

如果不包含 JS，则不会发生这种情况，一切都会像以前一样呈现。

所以在 application.js 中：

import "@fortawesome/fontawesome-pro/css/all.css";