The following error occurs for the first time in a Docker build process for “RUN npm run build” and I thought it is related to my Dockerfile. But when I run it outside the Docker container, I got the same error. Surprisingly, I don't get any error on my windows device. I figured out that it might have to do with case sensitivity. But as far as I can see, everything looks fine in my code.
Do you have any Idea how to fix these error:
1. If 'mat-icon' is an Angular component, then verify that it is part of this mo dule.2. If 'mat-icon' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@N gModule.schemas' of this component to suppress this message.6 <mat-icon>menu</mat-icon> ~~~~~~~~~~ src/app/profile-menu/profile-menu.component.ts:5:16 5 templateUrl: './profile-menu.component.html', ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component ProfileMenuComponent.Error: src/app/profile-menu/profile-menu.component.html:8:3 - error NG8001: 'mat -sidenav-container' is not a known element:1. If 'mat-sidenav-container' is an Angular component, then verify that it is pa rt of this module.2. If 'mat-sidenav-container' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEM A' to the '@NgModule.schemas' of this component to suppress this message.8 <mat-sidenav-container> ~~~~~~~~~~~~~~~~~~~~~~~ src/app/profile-menu/profile-menu.component.ts:5:16 5 templateUrl: './profile-menu.component.html', ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component ProfileMenuComponent....# further errors... src/app/verify-account/verify-account.component.ts:10:16 10 templateUrl: './verify-account.component.html', ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component VerifyAccountComponent.The command '/bin/sh -c npm run build' returned a non-zero code: 1Here are some part of the Code:
import {APP_INITIALIZER, NgModule} from '@angular/core';import {BrowserModule} from '@angular/platform-browser';import {AppRoutingModule} from './app-routing.module';import {AppComponent} from './app.component';import {NavbarComponent} from './navbar/navbar.component';import {FooterComponent} from './footer/footer.component';import {NavbarSettingsComponent} from './navbar-settings/navbar-settings.component';import {NavbarProfileComponent} from './navbar-profile/navbar-profile.component';import {NavbarAddFundsComponent} from './navbar-add-funds/navbar-add-funds.component';import {NavbarSearchbarComponent} from './navbar-searchbar/navbar-searchbar.component';import {TranslateLoader, TranslateModule} from "@ngx-translate/core";import {HttpClient, HttpClientModule} from "@angular/common/http";import {TranslateHttpLoader} from "@ngx-translate/http-loader";import {MatSidenavModule} from "@angular/material/sidenav";import {BrowserAnimationsModule} from '@angular/platform-browser/animations';import {MatButtonToggleModule} from "@angular/material/button-toggle";import {FormsModule, ReactiveFormsModule} from "@angular/forms";import {SignUpComponent} from './sign-up/sign-up.component';import {SignInComponent} from './sign-in/sign-in.component';import {HomeComponent} from './home/home.component';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 {MatButtonModule} from "@angular/material/button";import {NotFoundComponent} from './not-found/not-found.component';import {ForgotPasswordComponent} from './forgot-password/forgot-password.component';import {ResetPasswordComponent} from './reset-password/reset-password.component';import {LoadingSmallComponent} from './loading-small/loading-small.component';import {LoadingLargeComponent} from './loading-large/loading-large.component';import {ToastrModule} from "ngx-toastr";import {LoadingMediumComponent} from './loading-medium/loading-medium.component';import {VerifyAccountComponent} from './verify-account/verify-account.component';import {AddFundsModalComponent} from './modal-content/stripe/add-funds-modal/add-funds-modal.component';import {MatDialogModule} from "@angular/material/dialog";import {MatCheckboxModule} from "@angular/material/checkbox";import {MatMenuModule} from "@angular/material/menu";import {MatStepperModule} from "@angular/material/stepper";import {StripeCheckoutComponent} from './stripe-checkout/stripe-checkout.component';import {ModalComponent} from './modal/modal.component';import {StripeSuccessComponent} from './modal-content/stripe/stripe-success/stripe-success.component';import {StripeErrorComponent} from './modal-content/stripe/stripe-error/stripe-error.component';import {LottieModule} from "ngx-lottie";import player from 'lottie-web';import {AdminSettingsComponent} from './admin-settings/admin-settings.component';import {ProfileSettingsComponent} from './profile-settings/profile-settings.component';import {ProfileMenuComponent} from './profile-menu/profile-menu.component';import {AdminMenuComponent} from './admin-menu/admin-menu.component';import {MatListModule} from "@angular/material/list";import {AdminStatisticsComponent} from './admin-statistics/admin-statistics.component';import {AdminUserListComponent} from './admin-user-list/admin-user-list.component';import {AuthService} from "./auth.service";import {DepositSettingsComponent} from './deposit-settings/deposit-settings.component';import {MatTableModule} from "@angular/material/table";import {MatTooltipModule} from "@angular/material/tooltip";import {MatSortModule} from "@angular/material/sort";import {MatPaginatorModule} from "@angular/material/paginator";import {DeleteFundModalComponent} from './modal-content/deposit/delete-fund-modal/delete-fund-modal.component';import {EditFundModalComponent} from './modal-content/deposit/edit-fund-modal/edit-fund-modal.component';import {AddFundModalComponent} from './modal-content/deposit/add-fund-modal/add-fund-modal.component';import {CreateTicketComponent} from './support/create-ticket/create-ticket.component';import {MatSelectModule} from "@angular/material/select";import { CreateSupportTicketModalComponent} from './modal-content/support/create-support-ticket-modal/create-support-ticket-modal.component';export function initializeApp(authService: AuthService) { return (): Promise<any> => authService.initializeAuth();}@NgModule({ declarations: [ AppComponent, NavbarComponent, FooterComponent, NavbarSettingsComponent, NavbarProfileComponent, NavbarAddFundsComponent, NavbarSearchbarComponent, SignUpComponent, SignInComponent, HomeComponent, NotFoundComponent, ForgotPasswordComponent, ResetPasswordComponent, LoadingSmallComponent, LoadingLargeComponent, LoadingMediumComponent, VerifyAccountComponent, AddFundsModalComponent, StripeCheckoutComponent, ModalComponent, StripeSuccessComponent, StripeErrorComponent, AdminSettingsComponent, ProfileSettingsComponent, ProfileMenuComponent, AdminMenuComponent, AdminStatisticsComponent, AdminUserListComponent, DepositSettingsComponent, DeleteFundModalComponent, EditFundModalComponent, AddFundModalComponent, CreateTicketComponent, CreateSupportTicketModalComponent ], imports: [ BrowserModule, FormsModule, BrowserAnimationsModule, MatSidenavModule, MatButtonModule, MatButtonToggleModule, MatCheckboxModule, MatFormFieldModule, MatMenuModule, MatCardModule, MatIconModule, MatInputModule, MatSelectModule, MatDialogModule, MatStepperModule, MatListModule, MatTableModule, MatTooltipModule, MatSortModule, MatPaginatorModule, AppRoutingModule, HttpClientModule, LottieModule.forRoot({player: playerFactory}), TranslateModule.forRoot({ loader: { provide: TranslateLoader, useFactory: HttpLoaderFactory, deps: [HttpClient] } }), ToastrModule.forRoot( { timeOut: 6000, positionClass: 'toast-bottom-right', preventDuplicates: true, progressBar: true, progressAnimation: 'decreasing', } ), ReactiveFormsModule ], providers: [ { provide: APP_INITIALIZER, useFactory: initializeApp, deps: [AuthService], multi: true } ], bootstrap: [AppComponent]})export class AppModule {}export function HttpLoaderFactory(http: HttpClient) { return new TranslateHttpLoader(http);}export function playerFactory() { return player;}