It is hard to imagine any web development without some involvement of FontAwesome. Most of the time that is the first icon library I install in my projects. Sprockets does a great job and I am grateful for it. I love the icon('fab fa-github') method it introduces but since Rails 5.1 we have been having Webpacker which is my preferred means of installing CSS and JavaScript libraries.

Installation

The first step is to add the package to packages.json. Run the following command in your terminal (console if you are on Windows).

$ yarn add @fortawesome/fontawesome-free

Then you can include it in your app/javascript/packs/application.js or other appropriate JS pack.

import "@fortawesome/fontawesome-free/css/all"

In case this doesn't work out (icons are not showing), try adding .css extension to the end of it. I am not sure why, but once very recently I had to do it to get it work.

import "@fortawesome/fontawesome-free/css/all.css"

You can test it it out using

<!-- FontAwesome 5 syntax -->
<i class="fab fa-github"></i>

<!-- FontAwesome 4 syntax -->
<i class="fa fa-github"></i>

Conclusion

Webpacker on Rails has been around for a while. I my self have ignored it in the early days to avoid any teething issues. Since Rails 6 I think Webpacker is the way to go. We will miss the good old icon() helper (which started as fa_icon() in the early days) but that is some thing we can easily code in a helper.