Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

FaIconLibrary not found when using angular-fontawesome and font-awesome 5

I have the following error when trying to use @fortawesome/angular-fontawesome in my angular 7 application:

node_modules/@fortawesome/angular-fontawesome/angular-fontawesome"' has no exported member 'FaIconLibrary

I followed the documentation and initialized the module this way:

import { FontAwesomeModule, FaIconLibrary } from '@fortawesome/angular-fontawesome';
(...)

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    (...)
    FontAwesomeModule,
    (...)
  ],
  bootstrap: [AppComponent]
})
export class AppModule {
  constructor(library: FaIconLibrary) {
    library.add(...icons);
  }
}

Here are the exact version I use:

"@angular/core": "7.2.2",
(...)
"@fortawesome/angular-fontawesome": "^0.3.0",
"@fortawesome/fontawesome-pro": "^5.11.2",
"@fortawesome/fontawesome-svg-core": "1.2.21",
"@fortawesome/free-brands-svg-icons": "5.10.1",
"@fortawesome/free-regular-svg-icons": "5.10.1",
"@fortawesome/free-solid-svg-icons": "5.10.1",

Thanks very much for your help! Thierry

like image 465
Thierry Templier Avatar asked Oct 14 '19 06:10

Thierry Templier


People also ask

Can we use font awesome in angular?

Font Awesome now has an official Angular component that's available for all who want to to easily use our icons in projects.


1 Answers

If you see release notes, FaIconLibrary is added from version 0.5.0 that is not compatible with angular 7.2.2. Then you should use old way for adding icons, for e.g:

import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
import { library } from '@fortawesome/fontawesome-svg-core';
import { faSquare, faCheckSquare } from '@fortawesome/free-solid-svg-icons';
import { faSquare as farSquare, faCheckSquare as farCheckSquare } from '@fortawesome/free-regular-svg-icons';
import { faStackOverflow, faGithub, faMedium } from '@fortawesome/free-brands-svg-icons'; 

...

export class AppModule {
  constructor() {
    library.add(faSquare, faCheckSquare, farSquare, farCheckSquare, faStackOverflow, faGithub, faMedium);
  }
}
like image 148
Fateme Fazli Avatar answered Sep 28 '22 07:09

Fateme Fazli