Font-Awesome 5 PRO in rails 5 app - ruby-on-rails

Question

In order to access to the benefits of the pro package, adding font-awesome 5 from the gem is not possible.
Tried diferent ways to add the files provided to the project. Following Official guide
Package content:
I saw in other stackoverflow posts, that the correct way to add it to the app is in
vendor/assets/
But after that, puting /on-server/'s css, js, and font or the /web-fonts-with-css/ files still didn't work.
Tried adding custom stylesheet link, require and import in scss. No way to achieve it.
Hope I've been clear.

Answer 1

Using the 'Web Fonts with CSS' approach has a wrinkle because the font url is hardcoded into the CSS file, but it can be done.
CSS:
Copy the fontawesome-all.css to the 'vendor/assets/stylesheets' folder.
Update your app/assets/stylesheets/application.css file with
*= require fontawesome-all
Fonts:
Then copy the webfonts folder to the public dir so all the fonts are in the public/webfonts folder.
Restart your server and you should now be able to see your FA5 fonts.
SVG with JS
If you want to make it even easier (only 1 file to track) then you can do the 'SVG with JS' approach.
JS:
Copy the fontawesome-all.js to the 'vendor/assets/javascripts' folder.
Update your app/assets/stylesheets/application.js file with
//= require fontawesome-all
Restart your server and you are good to go.

Answer 2

If you are using rails which supports Node Modules.
Add Configuration
npm config set "#fortawesome:registry" https://npm.fontawesome.com/ && \
npm config set "//npm.fontawesome.com/:_authToken" YOUR_AUTH_TOKEN
OR
Save configuration in file .npmrc in app root folder as below
#fortawesome:registry=https://npm.fontawesome.com/
//npm.fontawesome.com/:_authToken=YOUR_AUTH_TOKEN
Run NPM or YARN to install the package
npm install --save #fortawesome/fontawesome-pro
OR
yarn add #fortawesome/fontawesome-pro
Add the packages in app/assets/application.js file
//= require #fortawesome/fontawesome-pro/js/all.min.js
Include Node Modules folder in assets path by adding below line in config/application.rb
config.assets.paths << Rails.root.join('node_modules')
Start the server again and you are good to go with font-awesome PRO.
For more details you can visit the below link:
https://fontawesome.com/how-to-use/on-the-web/setup/using-package-managers

Answer 3

There is also a way to use raw svg without any js and thus avoiding rendering issues and nasty hacks that lead to annoying flickering side effects
It comes in the form of a view helper called faw_icon https://github.com/alexwebgr/faw_icon and it provides three ways to load svg into your application
using the icons.json from the metadata
using the raw single svg files
using the svg sprites
by design it doesn't bundle any icons catering for a small download size and giving the developers the ability to update the icon sets as new ones become available, use custom ones or the PRO collection