Angular проблема изготовления материала

Question

В моем проекте Angular 7 я пытаюсь обслуживать проект Angular в производственном режиме с помощью команды ng serve --prod. Но я получаю ошибки для библиотеки материалов angular, такой как:

ERROR in : There is no directive with "exportAs" set to "ngForm" (" *ngIf="cardList?.length > 0">
                                <form name="form" autocomplete="off" [ERROR ->]#form ="ngForm">
                                    <div class=" form-group amount">
               ")
: There is no directive with "exportAs" set to "ngModel" (" type="number" appNumbersdirective placeholder="Enter Amount"  min="1" name="CheckAmount" required  [ERROR ->]#CheckAmount="ngModel" [(ngModel)]="bankInfo.CheckAmount">
                                          ")
: Can't bind to 'ngModel' since it isn't a known property of 'input'. ("rsdirective placeholder="Enter Amount"  min="1" name="CheckAmount"required  #CheckAmount="ngModel" [ERROR ->][(ngModel)]="bankInfo.CheckAmount">
                                            <mat-error *ngIf="Che")
: 'mat-error' is not a known element:
1. If 'mat-error' is an Angular component, then verify that it is part of this module.
2. If 'mat-error' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("eckAmount="ngModel" [(ngModel)]="bankInfo.CheckAmount">
                                            [ERROR ->]<mat-error *ngIf="CheckAmount.errors?.required">
                                                Amou")

Я уже включил MatFormFieldModule в app.module.ts раздел импорта, но все еще не могу устранить проблему.

Кроме того, вот фрагмент одного из моих файлов, который вызывает ошибки:

Module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { TransferMoneyComponent } from './transfer-money.component';
import { Routes, RouterModule } from '@angular/router';
import { DashboardHeaderModule } from '@component/dashboard-header/dashboard-header.module';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
import { MatSelectModule} from '@angular/material/select';
import { CreditCardDirectivesModule } from 'angular-cc-library';
import { MatTableModule } from '@angular/material/table';
import { MatPaginatorModule } from '@angular/material/paginator';
import { NgKnifeModule } from 'ng-knife';
import { MatProgressSpinnerModule } from '@angular/material';
import { MatTabsModule } from '@angular/material/tabs';
import { ReactiveFormsModule, FormsModule }   from '@angular/forms';
import { MatRadioModule } from '@angular/material/radio';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';

const routes: Routes = [{
  path: '',
  component: TransferMoneyComponent
}
];

@NgModule({
  declarations: [TransferMoneyComponent],
  imports: [
    CommonModule,
    NgbModule,
    RouterModule,
    DashboardHeaderModule,
    FormsModule,
    ReactiveFormsModule,
    MatFormFieldModule,
    MatInputModule,
    MatSelectModule,
    MatTableModule,
    MatPaginatorModule,
    NgKnifeModule,
    MatTabsModule,
    CreditCardDirectivesModule,
    MatProgressSpinnerModule,
    MatRadioModule,
    MatSlideToggleModule,
    [RouterModule.forChild(routes)]
  ]
})
export class TransferMoneyModule { }

html

</div>
      <mat-tab-group>

        <!-- Pay money tab -->
        <mat-tab label="Transfer to Bank">
            <!-- <mat-icon class="example-tab-icon">thumb_up</mat-icon> -->
            <div>
                  <!-- test start -->
                    <div class="selectAccountOuter">
                      <div class="paymentContainer">

                          <!-- <h4>Select account</h4> -->

                           <!-- add money to wallet from bank -->
                          <div *ngIf="cardList?.length > 0">
                              <form name="form" autocomplete="off" #form ="ngForm">
                                  <div class=" form-group amount">
                                      <div class="col-12">
                                        <mat-form-field>
                                          <input matInput type="number" appNumbersdirective placeholder="Enter Amount"  min="1" name="CheckAmount" required  #CheckAmount="ngModel" [(ngModel)]="bankInfo.CheckAmount">
                                          <mat-error *ngIf="CheckAmount.errors?.required">
                                              Amount is required.  
                                          </mat-error>
                                          <mat-error *ngIf="bankInfo.CheckAmount >= 0 ">
                                              Amount cannot be zero
                                          </mat-error>
                                        </mat-form-field>
                                      </div>
                                  </div> .......

Все отлично работает в режиме разработки, но создает ошибку при проверке в рабочем режиме. Я совершенно новичок в Angular.