19
9

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

RailsでFont Awesomeを導入する際の注意点

Last updated at Posted at 2019-01-29

RailsにFont Awesomeを導入する方法

導入方法を調べると二つやり方が出てきました。

一つは gem 'font-awesome-rails'を導入する方法。
もう一つは gem 'font-awesome-sass'を導入する方法。

前者だと最新版のfont-awesome5に対応していないという記事を見つけました。
なので後者を導入したのですが、少しだけハマった為、共有いたします。

※参考にした記事
https://qiita.com/paudorino/items/d54348f6d48eefcee6c7

両者の違い

詳しい導入方法は別の記事を参考にしていただけたらと思います。
font-awesome-railsと、font-awesome-sassの違い
それはヘルパーメソッドです。

font-awesome-railsを導入すると
fa_icon, fa_stacked_iconの二種類のヘルパーメソッドが使用できます。
なのでfont-awesome-sassを導入してFontAwesomeを使用する場合は、
上記のヘルパーメソッドは使えないので気をつけましょうということです!!

font-awesome-sassを導入した場合

こちらのコードだとしっかり表示されます。
他にもおそらくやり方はありますが、、、

<%= icon("fas", "star") %>
または
= icon("fas", "star")

先ほどのヘルパーメソッドを使用するとこのようなエラーが出ると思います。
undefined method `fa_icon'

19
9
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
19
9

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?