ruby-on-rails - rails : Font awesome icons not showing using font-awesome-rails gem

Question

我似乎找不到适合我的答案。

图标显示为一个框:

我正在使用:

font-awesome-rails (4.6.2.0)
rails (4.2.3)

我使用以下方法在 application.scss 文件中导入了 font-awesome-rails:

@import "font-awesome";

这是我为这个观点写的:

<i class="quote-left fa fa-quote-left"></i>

我试过在引导之前和之后包括它。

我还尝试手动将字体文件夹添加到 application.rb 中的管道

config.assets.paths << Rails.root.join("app", "assets", "fonts")

清除 tmp 文件夹似乎也没有做任何事情。

我花了太多时间在这上面，请帮助:(

Answer 1

我在使用 时遇到了这个问题 rails 6 和 Bootstrap 4 在 Ubuntu 20.04 .
我以这种方式设置了 Fontawesome :
首先，我将 Font Awesome 添加到我的 package.json文件:

yarn add @fortawesome/fontawesome-free

接下来，我将它导入我的 app/javascript/packs/application.js文件:

require("@fortawesome/fontawesome-free")

接下来，我将它导入我的 app/assets/stylesheets/application.scss文件:

$fa-font-path: '@fortawesome/fontawesome-free/webfonts';
@import '@fortawesome/fontawesome-free/scss/fontawesome';
@import '@fortawesome/fontawesome-free/scss/brands';
@import '@fortawesome/fontawesome-free/scss/solid';
@import '@fortawesome/fontawesome-free/scss/regular';
@import '@fortawesome/fontawesome-free/scss/v4-shims';

我还添加了 Font Awesome 5 Rails gem 到我的 Gemfile:

gem 'font_awesome5_rails'

并将其安装在我的项目中:

bundle install

最后我修改了从这种格式调用我的 fontawesome 图标的位置:

<i class="fas fa-camera-retro"></i>

到这种格式

fa_icon('camera-retro')

但问题是图标在开发中显示良好，但在生产中却没有。
这是我修复它的方法 :
问题是我需要导入 FontAwesome 5 字体到 app/assets/stylesheets/application.scss文件。所以我将它导入到它:

@import 'font_awesome5_webfont';

所以我对 app/assets/stylesheets/application.scss 的 fontawesome 导入文件最终看起来像这样:

@import 'font_awesome5_webfont';
$fa-font-path: '@fortawesome/fontawesome-free/webfonts';
@import '@fortawesome/fontawesome-free/scss/fontawesome';
@import '@fortawesome/fontawesome-free/scss/brands';
@import '@fortawesome/fontawesome-free/scss/solid';
@import '@fortawesome/fontawesome-free/scss/regular';
@import '@fortawesome/fontawesome-free/scss/v4-shims';

这一次，图标在开发和生产中都能正确显示。
备注 : 请确保在进行这些更改后重新编译您的 Assets 并重新启动您的服务器。
就这样。
我希望这会有所帮助