How to install Font Awesome 5 in Angular 6?

Since I do not use yarn search for npm ( link ).

In src / app / app.module.ts

  

Import {FontAwesomeModule} from '@ fortawesome / angular-fontawesome'

I add it to imports

  

FontAwesomeModule

And this causes me the following error by console:

Uncaught Error: Unexpected value 'undefined' imported by the module 'AppModule'     at syntaxError (compiler.js: 1016)     at compiler.js: 10584     at Array.forEach ()     at CompileMetadataResolver.push ../ node_modules/@angular/compiler/fesm5/compiler.js.CompileMetadataResolver.getNgModuleMetadata (compiler.js: 10553)     at JitCompiler.push ../ node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._loadModules (compiler.js: 23850)     at JitCompiler.push ../ node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileModuleAndComponents (compiler.js: 23831)     at JitCompiler.push ../ node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler.compileModuleAsync (compiler.js: 23791)     at CompilerImpl.push ../ node_modules/@angular/platform-browser-dynamic/fesm5/platform-browser-dynamic.js.CompilerImpl.compileModuleAsync (platform-browser-dynamic.js: 143)     at PlatformRef.push ../ node_modules/@angular/core/fesm5/core.js.PlatformRef.bootstrapModule (core.js: 4352)     at Object ../ src / main.ts (main.ts: 11)

Update 1:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { routing, appRoutingProviders } from './app.routing';
import { DataTablesModule } from 'angular-datatables';
import { HttpClientModule } from '@angular/common/http';
import { ReactiveFormsModule } from '@angular/forms';

import { FontAwesomeModule } from '@fortawesome/fontawesome-free';

import { AppComponent } from './app.component';
import { HomeComponent } from './components/home.component';
import { ConversorPipe } from './pipes/conversorMayusMinus.pipe';
import { ErrorComponent } from './components/error.component';

import { CategoriaComponent } from './components/categoria.component';
import { ColorComponent } from './components/color.component';

@NgModule({
  declarations: [
    AppComponent,
    HomeComponent,
    ConversorPipe,
    ErrorComponent,
    CategoriaComponent,
    ColorComponent,
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    routing,
    ReactiveFormsModule,
    HttpClientModule,
    DataTablesModule,
    FontAwesomeModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Update 2:

Change the next line of code

  

import {FontAwesomeModule} from '@ fortawesome / fontawesome-free';

for this:

  

import {FontAwesomeModule} from '@ fortawesome / angular-fontawesome';

This generates the following error:

  

./ node_modules/@fortawesome/angular-fontawesome/fesm5/angular-fontawesome.js   Module not found: Error: Can not resolve '@ fortwesome / fontawesome-svg-core' in 'C: \ wamp64 \ www \ webapp \ node_modules \ @fortawesome \ angular-fontawesome \ fesm5'

Update 3: Add:

  

import {library} from '@ fortawesome / fontawesome-svg-core';

It generates the following error:

Update 4:

Following the suggestion of @ LPZadkiel .