Fontawesome 5 с Angular 2+

Я не знаю, как включить FontAwesome 5 в приложение Angular 2+. Я нашел этот пакет - https://www.npmjs.com/package/@fortawesome/fontawesome Не могли бы вы сказать мне, куда мне следует импортировать этот пакет? Может быть, в файле app.module.ts?


person bartekgorski    schedule 21.02.2018    source источник


Ответы (2)


Во-первых: вам нужно установить пакеты:

$ 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

Затем в вашем app.component.ts вы добавляете импорт:

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

и в вашем конструкторе app.component вы добавляете значок в библиотеку шрифтов:

fontawesome.library.add(faTrashAlt);

На странице html вы просто добавляете значок:

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

Ссылка на документацию по fontawesome: https://fontawesome.com/how-to-use/use-with-node-js#free

person Miss_K    schedule 22.02.2018
comment
Значит, мне нужно добавлять значки по одному? Можно ли добавить все иконки сразу? - person Dimonina; 15.03.2018
comment
@Dimonina Да, вы можете — импортировать {fas} из '@fortawesome/free-solid-svg-icons'; fontawesome.library.add(fas); - person Angelo; 05.04.2018

вам нужно установить пакет:

npm install @fortawesome/fontawesome-free

затем импортировать все

import "@fortawesome/fontawesome-free/css/all.css";

или импортировать отдельно, вот так:

import "@fortawesome/fontawesome-free/css/fontawesome.css";
import "@fortawesome/fontawesome-free/css/solid.css";
person het    schedule 27.02.2019