Adding Font Awesome to an Angular CLI project using npm

The Font Awesome upgrade guide can be view here; but the instructions below are a bit more clear to understand.

Installation:
Using NPM:

$ npm install @fortawesome/fontawesome-svg-core
$ npm install @fortawesome/free-solid-svg-icons
$ npm install @fortawesome/fontawesome-free-brands
$ npm install @fortawesome/angular-fontawesome@0.5.x

Get up and running using Font Awesome with Angular follow below steps:
Add FontAwesomeModule to imports in src/app/app.module.ts:

Tie the icon to the property in your component src/app/app.component.ts:

Use the icon in the template src/app/app.component.html:

Done!

Image for post
Image for post

Written by

UX/UI consultant trying to make the web a better place, one user-centered experience at a time.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store