-1

I'm trying to make my FontAwesome 6 installation more lightweight by importing the few individual icons I'm using instead of a whole style, via my web app's npm build process. The documentation seems to say that the way to do this is by installing @fortawesome/fontawesome-svg-core (and then presumably an icon pack like @fortawesome/free-solid-svg-icons, although not explicitly mentioned in the docs).

Using FontAwesome in this way disables by default the following capabilities of the standard FontAwesome configuration:

  • Automatically replaces <i> tags with <svg>

  • Watches the page for icon changes and additions

Going deeper into this, another section of the docs shows that the specific options disabled are autoReplaceSvg and observeMutations.

What are the reason(s) that configuring FontAwesome in this way disables these options by default, and is there any disadvantage to re-enabling them, either performance or otherwise?

Hashim Aziz
  • 4,074
  • 5
  • 38
  • 68

1 Answers1

-1

A day or so later, I found this by chance in another section of the (very extensive) documentation:

Our Basic packages (@fortawesome/fontawesome-free and @fortawesome/fontawesome-pro) are aimed at individuals who would like to quickly integrate Font Awesome into their projects but do not want to invest the time and effort to understand what's going on under the hood. For this reason a lot of the behavior is automatic and works without any intervention.

In contrast, the fontawesome-svg-core package is for more specialized situations or for forming the underlying API to power other components or libraries. In fact, our own official components for Vue, React, Ember, and Angular all use the fontawesome-svg-core package under the hood.

Because of this the core package and the icon content packages avoid doing anything automatic or creating side-effects that make development with them difficult to control or reason.

Hashim Aziz
  • 4,074
  • 5
  • 38
  • 68