Search code examples
angularangular-moduleangular-fontawesome

Angular - export fontawesome to a feature module


In app.module I got the following lines regarding fontawesome

import { FontAwesomeModule, FaIconLibrary } from '@fortawesome/angular-fontawesome';
import { faBars, faCopyright } from '@fortawesome/free-solid-svg-icons';

export class AppModule { 
  constructor(private library: FaIconLibrary) {
  library.addIcons(faBars, faCopyright);
}

how can i include them in a feature module? the costructor part is troubling me


Solution

  • Icon library is provided using root scope, so you'll always have a single icon library instance per whole application. Therefore it is safe to inject it in the constructor of the feature module and add icons there.

    Although you can add icons from the lazy-loaded module constructor, in practice this will not gain you anything. You can as well add all icons in the AppModule. This is because of how FA icons are packaged and how Angular CLI build toolchain works. All FA icons are defined in the single module, so as soon as any of the icons is imported, all icons (used in your application) will be loaded. This is because Webpack can't split one module into multiple. E.g. if you import at least one icon synchronously, all icons will be loaded independently of whether you've imported them in the lazy-loaded module or not.