FontAwesome Icons in Angular 6?
all you have to do is:
1 - add this to your index.html:
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous">
2 - use your icon as:
<i class="fas fa-check"></i>
You don't have to add anything in your component.ts
nor in your app.module.ts
nor install anything with yarn or npm.
EDIT:To answer you question, here is a stackblitz with the faCheck used as mentioned in the tutorial, it's working for me: https://stackblitz.com/edit/angular-4ebr9t
check if you installed all the dependencies as said in the tutorial.
1- Install this npm install @fortawesome/fontawesome-free
2- Add this to angular.json
(angular-cli.json
)
"styles": [ "...", "./node_modules/@fortawesome/fontawesome-free/css/all.min.css"]
3- Now you can use fonts with <i>
tag
I am using Fontawesome in this angular6 project, please take a look on the package.json, maybe it helps to solve your problem:https://github.com/hamilton-lima/portfolio-web/blob/master/package.json
This is what I have installed
"@fortawesome/angular-fontawesome": "^0.1.1", "@fortawesome/fontawesome-svg-core": "^1.2.0", "@fortawesome/free-brands-svg-icons": "^5.1.0", "@fortawesome/free-regular-svg-icons": "^5.1.0", "@fortawesome/free-solid-svg-icons": "^5.1.0", "angular-font-awesome": "^3.1.2",
Make sure to import the necessary icons to the library you are using
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';import { library } from '@fortawesome/fontawesome-svg-core';import { fas } from '@fortawesome/free-solid-svg-icons';import { far } from '@fortawesome/free-regular-svg-icons';import { fab } from '@fortawesome/free-brands-svg-icons';library.add(fas, far, fab);
See the example here: https://github.com/hamilton-lima/portfolio-web/blob/master/src/app/shared/shared.module.ts