Forked from KarolinaCzo/gist:72a356c19eb511ad8a7b4594bdfa159b
Created
February 23, 2023 00:47
-
-
Save uzbekdev1/0baf3c4877d201953b69b8e8c8516f77 to your computer and use it in GitHub Desktop.
Add @fortawesome/fontawesome-free to an Angular project
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
How to add Font Awesome @fortawesome/fontawesome-free to an Angular project? | |
1) Go to the project directory | |
2) Install Font Awesome as said on their website: | |
https://fontawesome.com/how-to-use/on-the-web/setup/getting-started?using=web-fonts-with-css | |
through npm: npm install --save @fortawesome/fontawesome-free | |
Use '--save' not '--save-dev' | |
3) Add Font Awesome to 'styles' in 'anguler.json': | |
"styles": [ | |
"./node_modules/@fortawesome/fontawesome-free/scss/fontawesome.scss", | |
"./node_modules/@fortawesome/fontawesome-free/scss/regular.scss", | |
"./node_modules/@fortawesome/fontawesome-free/scss/solid.scss", | |
"./node_modules/@fortawesome/fontawesome-free/scss/brands.scss", | |
"src/styles.scss" | |
] | |
4) Import Font Awesome to 'styles.scss' and add the path to the font: | |
$fa-font-path: '~@fortawesome/fontawesome-free/webfonts'; | |
@import '~@fortawesome/fontawesome-free/scss/fontawesome.scss'; | |
@import '~@fortawesome/fontawesome-free/scss/regular.scss'; | |
@import '~@fortawesome/fontawesome-free/scss/solid.scss'; | |
@import '~@fortawesome/fontawesome-free/scss/brands.scss'; | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment