Rails(6系)でFont Awesomeを使う方法
Ruby on Rails (6系)では、Webpackerを使用してJavaScriptやSCSSを管理するようになりました。
よって、Gemで入れるのではなく、Yarnを使用します。
yarn add @fortawesome/fontawesome-free※ fontawesomeではなくfortawesomeであるところに注意してください。
@import '@fortawesome/fontawesome-free/scss/fontawesome';
@import '@fortawesome/fontawesome-free/scss/solid';
@import '@fortawesome/fontawesome-free/scss/regular';
@import '@fortawesome/fontawesome-free/scss/brands';
@import '@fortawesome/fontawesome-free/scss/v4-shims';上記のコードを該当のファイルに追加してください。
ここでは、各種フォントのSCSSを読み込んでいます。
import '@fortawesome/fontawesome-free/js/all'上記のコードを該当のファイルに追加してください。
<%= link_to root_path do %>
<i class="fas fa-home fa-fw"></i> Home
<% end %>使用するときは、上記のようにブロックで囲むように使用します。
直接classに割り当てるとエラーが発生する場合があります。
※ .fa-fwは、Font Awesomeのアイコンを等倍にするclassです。使ってあげると見た目が整うでしょう。
