Cannot generate an Angular stepper component because MDBoots

Based on Arkadiusz's comment, I tried replacing my individual imports with MDBBootstrapModulesPro.forRoot() on src/app/app.module.ts. The Angular compatibility error now goes away, but I still can't see my stepper.

I'm still new to Angular, so maybe it's just a mistake of mine. To rule that out, I'll provide my relevant files.

src/app/app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { NgModule, NO_ERRORS_SCHEMA } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { AgmCoreModule } from '@agm/core';
import { AppComponent } from './app.component';

import { MDBSpinningPreloader, MDBBootstrapModulesPro, ToastModule, MdbStepperComponent, MdbStepComponent } from 'ng-uikit-pro-standard';
import { VerticalStepperComponent } from './vertical-stepper/vertical-stepper.component';

@NgModule({
declarations: [
   AppComponent,
   VerticalStepperComponent
],
imports: [
   BrowserModule,
   BrowserAnimationsModule,
   FormsModule,
   HttpClientModule,
   ToastModule.forRoot(),
   MDBBootstrapModulesPro.forRoot(),
   //MdbStepperComponent,
   //MdbStepComponent,
   //StepperModule, WavesModule,
   AgmCoreModule.forRoot({
      // https://developers.google.com/maps/documentation/javascript/get-api-key?hl=en#key
      apiKey: 'Your_api_key'
   })
],
providers: [MDBSpinningPreloader],
bootstrap: [AppComponent],
schemas:      [ NO_ERRORS_SCHEMA ]
})
export class AppModule { }

src/app/app.component.html

<div style="height: 100vh">
<div class="flex-center flex-column">
   <h1 class="animated fadeIn mb-4">Material Design for Bootstrap (Angular)</h1>

   <h5 class="animated fadeIn mb-3">Thank you for using our product. We're glad you're with us.</h5>
   <h6 class="animated fadeIn mb-3">Start browsing <a href="https://mdbootstrap.com/angular">documentation</a>.</h6>

   <p class="animated fadeIn text-muted">MDB Team</p>

   <p>Test goes here</p>
   <vertical-stepper></vertical-stepper>
</div>
</div>

src/app/vertical-stepper/vertical-stepper.component.html

<mdb-stepper #stepper [vertical]="true">
   <mdb-step name="Step 1" label="Type something" [stepForm]="firstFormGroup">
     <form [formGroup]="firstFormGroup">
       <div class="md-form">
         <input type="text" class="form-control" mdbInput mdbValidate formControlName="email">
         <label for="">Email</label>
         <mdb-error *ngIf="email.invalid && (email.dirty || email.touched)">Input invalid</mdb-error>
         <mdb-success *ngIf="email.valid && (email.dirty || email.touched)">Input valid</mdb-success>
       </div>
     </form>
     <button mdbBtn size="sm" color="primary" (click)="stepper.next()">CONTINUE</button>
   </mdb-step>
   <mdb-step name="Step 2" [stepForm]="secondFormGroup">
     <form [formGroup]="secondFormGroup">
       <div class="md-form">
         <input type="password" class="form-control" mdbInput mdbValidate formControlName="password">
         <label for="">Password</label>
         <mdb-error *ngIf="password.invalid && (password.dirty || password.touched)">Input invalid</mdb-error>
         <mdb-success *ngIf="password.valid && (password.dirty || password.touched)">Input valid</mdb-success>
       </div>
     </form>
     <button mdbBtn size="sm" color="primary" (click)="stepper.next()">CONTINUE</button>
     <button mdbBtn size="sm" color="secondary" (click)="stepper.previous()">BACK</button>
   </mdb-step>
   <mdb-step name="Step 3" label="Step 3 label">
     <p class="pl-2">Finish!</p>
     <div class="step-actions">
       <button mdbBtn  size="sm" color="primary" (click)="onSubmit()">SUBMIT</button>
     </div>
   </mdb-step>
</mdb-stepper>

src/app/vertical-stepper/vertical-stepper.component.ts

import { Component, OnInit } from '@angular/core';
import { FormGroup, FormControl, Validators } from '@angular/forms';
import { StepperModule, WavesModule } from 'ng-uikit-pro-standard';

@Component({
  selector: 'vertical-stepper',
  templateUrl: './vertical-stepper.component.html',
})
export class VerticalStepperComponent implements OnInit {
  firstFormGroup: FormGroup;
  secondFormGroup: FormGroup;

  ngOnInit() {
    this.firstFormGroup = new FormGroup({
      email: new FormControl('', [Validators.required, Validators.email])
    });
    this.secondFormGroup = new FormGroup({
      password: new FormControl('', Validators.required)
    });
  }

  get email() { return this.firstFormGroup.get('email'); }
  get password() { return this.secondFormGroup.get('password'); }

  onSubmit() {
    // do something here
  }

}