All threads / How do I include FontAwesome Pro in a Rails 7 project?
Ask A Question

Notifications

You’re not receiving notifications from this thread.

How do I include FontAwesome Pro in a Rails 7 project?

Dave Sanders asked in Rails

I own a license to FA Pro, and I want to use it in a new Rails 7 project. It doesn't look like I can do an importmap include of the pro font awesome, or if so, I'm doing it wrong. So I downloaded the latest build and dropped it into my vendors folder.

But I can't figure out what I need to do to be able to use these classes. I tried a stylesheet link tag to the vendors folder (and kept trying various paths for the subfolders). I tried adding it to my manifest, but I can't seem to reference it in my SCSS imports.

Ideally, I'd like to link to the vendor'ed fontawesome all.min.css separately in my layout, rather than include it in my application CSS. But I'm having a heck of a time figuring out how to add it properly.

I realized just now that I can use the Pro CDN for font awesome directly. But, I'm going to leave this question open in case someone knows how to solve this, so I have it for another day, or if I decide to serve FA myself.

I think if you are using "importmap" you can pin your vendor asset like the documentation said https://github.com/rails/importmap-rails

Absolute path:
import React from "/Users/DHH/projects/basecamp/node_modules/react"
Relative path:
import React from "./node_modules/react"
HTTP path:
import React from "https://ga.jspm.io/npm:react@17.0.1/index.js"
Importmap-rails provides a clean API for mapping "bare module specifiers" like "react" to 1 of the 3 viable ways of loading ES Module javascript packages.

For example:

config/importmap.rb

pin "react", to: "https://ga.jspm.io/npm:react@17.0.2/index.js"
means "everytime you see import React from "react" change it to import React from "https://ga.jspm.io/npm:react@17.0.2/index.js""

import React from "react"
// => import React from "https://ga.jspm.io/npm:react@17.0.2/index.js"

Join the discussion

Want to stay up-to-date with Ruby on Rails?

Join 68,326+ developers who get early access to new tutorials, screencasts, articles, and more.

    We care about the protection of your data. Read our Privacy Policy.

    logo Created with Sketch.

    Screencast tutorials to help you learn Ruby on Rails, Javascript, Hotwire, Turbo, Stimulus.js, PostgreSQL, MySQL, Ubuntu, and more. Icons by Icons8

    © 2022 GoRails, LLC. All rights reserved.