import { BrowserModule } from '@angular/platform-browser' ; import { NgModule } from '@angular/core' ; import { AppRoutingModule } from './app-routing.module' ; import { AppComponent } from './app.component' ; import { BrowserAnimationsModule } from '@angular/platform-browser/animations' ; import { FormsModule , ReactiveFormsModule } from '@angular/forms' ; import { FlexLayoutModule } from '@angular/flex-layout' ; import { SignInComponent } from './sign-in/sign-in.component' ; import { SignUpComponent } from './sign-up/sign-up.component' ; import { PrivateComponent } from './private/private.component' ; import { AnswerChallengeComponent } from './answer-challenge/answer-challenge.component' ; import { SignOutComponent } from './sign-out/sign-out.component' ; import { MatButtonModule } from '@angular/material/button' ; import { MatCardModule } from '@angular/material/card' ; import { MatFormFieldModule } from '@angular/material/form-field' ; import { MatIconModule } from '@angular/material/icon' ; import { MatInputModule } from '@angular/material/input' ; import { MatProgressSpinnerModule } from '@angular/material/progress-spinner' ; import { NotFoundComponent } from './not-found/not-found.component' ; const MAT_MODULES = [ MatCardModule , MatButtonModule , MatFormFieldModule , MatInputModule , MatProgressSpinnerModule , MatIconModule , ] ; @ NgModule ( { declarations : [ AppComponent , SignInComponent , SignUpComponent , PrivateComponent , AnswerChallengeComponent , SignOutComponent , NotFoundComponent ] , imports : [ BrowserModule , AppRoutingModule , BrowserAnimationsModule , FlexLayoutModule , FormsModule , ReactiveFormsModule , ... MAT_MODULES , ] , providers : [ ] , bootstrap : [ AppComponent ] } ) export class AppModule { }