I am upgrading an Angular project to use the pro version of the Font Awesome 5 icons. Until now, the project was using only the free version (v5). It is evident that it has, at some point in its long history, also used version 4 since the build settings refer to the v4-shims.css file and there are many instances of icons that use the "-o" suffix.
We're trying to cut the ties with v4 entirely so I updated angular.json to replace these 2 css files:
"node_modules/@fortawesome/fontawesome-free/css/all.css",
"node_modules/@fortawesome/fontawesome-free/css/v4-shims.css"
with this 1 css file:
"node_modules/@fortawesome/fontawesome-pro/css/all.css"
After making this change, the icons that use the "-o" suffix are broken and I can't find any advice in the changelogs on how to upgrade properly and safely.
My project contains 800+ font awesome icon instances so I'm looking for a way to do this update without having to check every instance individually.
If I want to update code like this:
<i class="fa fa-square-o"></i>
- Is it ok to just remove the "-o" suffix?
- If I don't explicitly switch 'fa' to one of the v5 style options (fas, far, fal, fad) will one of them be used as the default and if so, which one?
- Is there a recommended way to cleanly migrate from v4 to v5 without using the v4 shims?
Thanks!