Fontawesome 5 with Angular 2+

Question

I don't know how to include FontAwesome 5 to Angular 2+ app. I found this package - https://www.npmjs.com/package/@fortawesome/fontawesome Could you tell me where should I import this package? Maybe in app.module.ts file?

Answer 1

First: you need to install the packages:

$ npm i --save @fortawesome/fontawesome

$ npm i --save @fortawesome/fontawesome-free-solid
$ npm i --save @fortawesome/fontawesome-free-regular
$ npm i --save @fortawesome/fontawesome-free-brands

Then in your app.component.ts you add the imports:

import fontawesome from '@fortawesome/fontawesome';
import faTrashAlt from '@fortawesome/fontawesome-free-regular/';

and in your constuctor of the app.component you add the icon to the fontawesome library:

fontawesome.library.add(faTrashAlt);

In the html page you just add the icon:

<i class="far fa-trash-alt"></i>

Link to fontawesome documentation: https://fontawesome.com/how-to-use/use-with-node-js#free