In my project we had to acquire Font Awesome PRO and as such we're doing an internal component to replace replace the usage of the Font Awesome 6 componente from the Forge, as we had to use local css, etc... and aren't allowed to use the JS on the head of pages.
As such, I've downloaded the package files, added css (changed all classes to fapro like fa6 did) and webfonts to my component and now when I try to use it, in a screen that doesn't uses FA6, I'm getting errors :
Failed to load resource: the server responded with a status of 404 () for webfonts/fa-solid-900.woff2 and webfonts/fa-solid-900.ttf
All webfonts are set to deploy to target directory :
When we use FA6, this doesn't happen.
For FA6 that top folder with the woff2 file is created but not on the new one.
What could be causing this?
The Font awesome 6 forge component has a css file named "font-awesome-6-os-prefixed.css".You'll find that the file has been modified
from:
src: url("../webfonts/fa-solid-900.woff2") format("woff2"), url("../webfonts/fa-solid-900.woff") format("woff"), url("../webfonts/fa-solid-900.ttf") format("truetype");
To:
src: url("/FontAwesome6_PAT/webfonts/fa-solid-900.woff2") format("woff2"), url("/FontAwesome6_PAT/webfonts/fa-solid-900.ttf") format("truetype");
to load the font files from the correct path.
I recommend updating font awesome 6 pro "all.css" file and replacing "../" in urls with "/" followed by the name of the module that contains the new font awesome 6 pro resources