Ошибка NG002: не удалось разрешить в класс NgModule

Question

Я добавил новый компонент в свой проект angular и убедился, что он импортирован в мой модуль приложения, однако я получаю сообщение об ошибке NG002:

error NG6002: Appears in the NgModule.imports of AppModule, but could not be resolved to an NgModule class.

Is it missing an @NgModule annotation?

export class NavigationBarDriverComponent {

Мой модуль приложения выглядит следующим образом:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HttpClientModule } from '@angular/common/http';
import {GoogleMapsAPIWrapper} from '@agm/core';
import { AppComponent } from './app.component';
import { ButtonComponent } from './button/button.component';
import { AgmCoreModule } from '@agm/core';
import { AgmDirectionModule } from 'agm-direction';
import { GooglePlaceModule } from "ngx-google-places-autocomplete";
import { NavigationBarComponent } from './navigation-bar/navigation-bar.component';
import { NavigationBarDriverComponent} from './navigation-bar-driver/navigation-bar-driver.component';
import { LayoutModule } from '@angular/cdk/layout';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatButtonModule } from '@angular/material/button';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatIconModule } from '@angular/material/icon';
import { MatListModule } from '@angular/material/list';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { OwlDateTimeModule, OwlNativeDateTimeModule } from 'ng-pick-datetime';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

import { MatDialogModule } from '@angular/material/dialog';
import { RouteDialogComponent } from './route-dialog/route-dialog.component';

import { AppRoutingModule, routingComponents } from './app-routing.module';

@NgModule({
  declarations: [
    AppComponent,
    ButtonComponent,
    NavigationBarComponent,
    NavigationBarDriverComponent,
    RouteDialogComponent,
    routingComponents
  ],
  imports: [
    BrowserModule,
    AgmCoreModule.forRoot({
      apiKey: 'AIzaSyDnibzvTPaquvcrp9ZYZZ5EFgzncyK1jys'
    }),
    AgmDirectionModule,
    GooglePlaceModule,
    LayoutModule,
    MatToolbarModule,
    MatButtonModule,
    MatSidenavModule,
    MatIconModule,
    MatListModule,
    NoopAnimationsModule,
    HttpClientModule,
    OwlDateTimeModule,
    OwlNativeDateTimeModule,
    BrowserAnimationsModule,
    MatDialogModule,
    MatButtonModule,
    AppRoutingModule,
    NavigationBarDriverComponent
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

и мой NavigationBarDriverComponent выглядит следующим образом:

import { Component, NgModule } from '@angular/core';
import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
import { Observable } from 'rxjs';
import { map, shareReplay } from 'rxjs/operators';

@Component({
  selector: 'app-navigation-bar-driver',
  templateUrl: './navigation-bar-driver.component.html',
  styleUrls: ['./navigation-bar-driver.component.css']
})

export class NavigationBarDriverComponent {

  drawer;

  isHandset$: Observable<boolean> = this.breakpointObserver.observe(Breakpoints.Handset)
    .pipe(
      map(result => result.matches),
      shareReplay()
    );

  constructor(private breakpointObserver: BreakpointObserver) {}

}

Я попытался перезапустить сервер angular как с "ng serve", так и с "ng serve --prod", как я увидел это предложил в другой теме.