Импорт font-awesome через angular-cli.json в версии angular 6?

Question

Я был назначен инструктором для импорта font-awesome в файле angular-cli.json, но я использую angular 6, поэтому я инициализирую модуль узла font-awesome в файле angular.json, но он не работает, и ошибка в ng serve.

Answer 1

С https://www.npmjs.com/package/@fortawesome/angular-fontawesome:

npm install –save '@fortawesome/angular-fontawesome' 

npm install –save ‘@fortawesome/fontawesome-svg-core' 

npm i --save '@fortawesome/free-solid-svg-icons'

Помня, что в руководстве не упоминалось о необходимости запуска двух последних команд, но это зависимости, требуемые для Font Awesome.

Answer 2

Установочные пакеты npm install --save font-awesome angular-font-awesome

Импорт модуля:

//...
import { AngularFontAwesomeModule } from 'angular-font-awesome';
@NgModule({
  //...
  imports: [
    //...
    AngularFontAwesomeModule
  ],
  //...
})
export class AppModule { }

Если вы используете Angular CLI, добавьте удивительный шрифт CSS в styles внутри angular-cli.json

"styles": [
    "styles.css",
    "../node_modules/font-awesome/css/font-awesome.css"
],

ПРИМЕЧАНИЕ. При использовании препроцессора SCSS просто измените css на scss

Если вы не используете CLI, импортируйте таблицу стилей в файл index.html

<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" />  

Если вы использовали неправильную команду для установки font-awesome:

1. удалите установленную зависимость из папки package.json
2. remove node_modules вручную.
3. run npm cache clean --force
4. run npm install
5. и выполните шаги, которые я упомянул выше.