Compiler fails - ERROR in No NgModule metadata found for 'AppModule'

Issue

Compile fails with this error. I have looked through all the posts with similar titles and not found anything helpful yet. Angular 7. I was trying to update some dependencies to resolve prod vulnerabilities, the change list for this was moving angular-devkit/build-angular to dev dependencies, removing abandoned and unused packages, adding ngx-toastr 10, upgrading jasmine-core from 3.3 to 3.8.

I have deleted, cleared cache, and reinstalled all node packages and then tried specifically doing that to angular/cli (7.1.1) and webpack (4.12.0). Edited+saved a random ts file. Added app/app.module.ts specifically to tsconfig.app.json's files param and include param. Added strictMetadataEmit:false to tsconfig.json and tsconfig.app.json compilerOptions (unknown compiler param error).

tsconfig.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "baseUrl": "./src",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "types": [
      "jasmine"
    ],
    "lib": [
      "es2017",
      "dom"
    ],
    "paths": {
      "@app/*": [ "app/*" ],
      "@env/*": [ "environments/*" ]
    }
  },
  "include": [
    "src/**/*"
  ]
}

tsconfig.app.json

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/app",
    "module": "es2015",
    "baseUrl": "",
    "types": []
  },
  "exclude": [
    "test.ts",
    "**/*.spec.ts"
  ],
  "include": [
    "./**/*"
  ]
}

package.json

{
  "name": "pds.ui",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "inc-ram": "set NODE_OPTIONS=--max-old-space-size=12000",
    "build-prod": "npm run-script inc-ram && ng build --prod --source-map false --aot"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^7.1.3",
    "@angular/common": "^7.1.3",
    "@angular/compiler": "^7.1.3",
    "@angular/core": "^7.1.3",
    "@angular/forms": "^7.1.3",
    "@angular/http": "^7.1.3",
    "@angular/platform-browser": "^7.1.3",
    "@angular/platform-browser-dynamic": "^7.1.3",
    "@angular/router": "^7.1.3",
    "@progress/kendo-angular-buttons": "^4.1.1",
    "@progress/kendo-angular-dateinputs": "^3.5.2",
    "@progress/kendo-angular-dialog": "^3.1.2",
    "@progress/kendo-angular-dropdowns": "^3.0.2",
    "@progress/kendo-angular-excel-export": "^2.1.0",
    "@progress/kendo-angular-grid": "^3.5.0",
    "@progress/kendo-angular-inputs": "^3.1.3",
    "@progress/kendo-angular-intl": "^1.3.1",
    "@progress/kendo-angular-l10n": "^1.1.0",
    "@progress/kendo-angular-layout": "^3.1.1",
    "@progress/kendo-angular-pdf-export": "^1.0.4",
    "@progress/kendo-angular-upload": "^4.1.2",
    "@progress/kendo-data-query": "^1.2.0",
    "@progress/kendo-drawing": "^1.5.5",
    "@progress/kendo-theme-bootstrap": "^2.13.4",
    "@progress/kendo-theme-default": "^2.53.1",
    "angular-calendar": "^0.27.15",
    "angular2-draggable": "^2.1.1",
    "bootstrap": "^4.0.0",
    "classlist.js": "^1.1.20150312",
    "core-js": "^2.5.3",
    "date-fns": "^1.30.1",
    "font-awesome": "^4.7.0",
    "guid-typescript": "^1.0.9",
    "jasmine-tfs-reporter": "^1.0.2",
    "json2typescript": "1.0.6",
    "moment": "^2.20.1",
    "ngx-bootstrap": "^3.0.0",
    "ngx-permissions": "^6.0.1",
    "ngx-quill": "^5.2.0",
    "ngx-toastr": "^10.1.0",
    "node-sass": "^4.7.2",
    "npm": "^6.4.1",
    "quill": "^1.3.7",
    "rxjs": "^6.2.1",
    "rxjs-compat": "^6.2.1",
    "ts-helpers": "^1.1.2",
    "typescript": "3.2.4",
    "web-animations-js": "^2.3.1",
    "zone.js": "^0.8.20"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^0.11.4",
    "@angular-devkit/build-optimizer": "^0.11.3",
    "@angular/cli": "^7.1.1",
    "@angular/compiler-cli": "^7.1.3",
    "@types/applicationinsights-js": "1.0.9",
    "@types/jasmine": "3.3.1",
    "@types/node": "^10.3.2",
    "codelyzer": "^4.1.0",
    "html-webpack-plugin": "^3.2.0",
    "jasmine-core": "~3.8.0",
    "jasmine-spec-reporter": "^4.2.1",
    "karma": "~3.1.3",
    "karma-chrome-launcher": "~2.2.0",
    "karma-cli": "~2.0.0",
    "karma-coverage-istanbul-reporter": "^2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.1.0",
    "protractor": "^5.4.1",
    "ts-node": "~7.0.1",
    "tslint": "~5.11.0",
    "webpack": "^4.12.0"
  },
  "engines": {
    "node": ">= 8.6.0",
    "npm": ">= 5.4.2"
  }
}

app.module.ts

// Angular
import { NgModule, OnInit, APP_INITIALIZER } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { BrowserModule, Title } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { Injector } from '@angular/core';

// Kendo & 3rd Party
import { InputsModule } from '@progress/kendo-angular-inputs';
import { ModalModule } from 'ngx-bootstrap';
import { UploadModule } from '@progress/kendo-angular-upload';

import { CoreModule, ConfigService } from '@app/core';
import { SharedModule } from '@app/shared';


// App
import { AppComponent } from './app.component';
import { AppRoutingModule } from './app.routing';
import { HeaderComponent } from './header/header.component';
import { AdminModule } from './admin/admin.module';
import { MasterProjectModule } from './master-project/master-project.module';
import { ContractModule } from './contract/contract.module';
import { FAQComponent } from './shared/faq/faq.component';
import { DashboardModule } from './dashboard/dashboard.module';
import { AngularDraggableModule } from 'angular2-draggable';

// Services
import { RepositoryService } from '@app/shared/repository.service';
import { ServiceLocator } from '@app/shared/service-locator';
import { EmailService } from '@app/shared/email.service';
import { CanDeactivateGuardService } from '@app/shared/candeactivate-guard.service';
import { NavigationEnd, Router, ActivatedRoute } from '@angular/router';
import { MasterProjectRoutingModule } from '@app/master-project/master-project-routing.module';
import { ContractRoutingModule } from '@app/contract/contract-routing.module';
import { DashboardRoutingModule } from '@app/dashboard/dashboard-routing.module';
import { DialogModule } from '@progress/kendo-angular-dialog';
import { NgxPermissionsModule } from 'ngx-permissions';
import { NgxPermissionsService } from 'ngx-permissions';
import { Role } from '@app/core/role';
import { NgxRolesService } from 'ngx-permissions';
import { HttpClientModule, HttpClient } from '@angular/common/http';
import { AcknowledgementsComponent } from './shared/acknowledgements/acknowledgements';
import { ToastrModule } from 'ngx-toastr';
import { ProgressBarComponent } from './shared/ProgressBar/ProgressBar';
import { LoadingBarService } from './shared/LoadingBarService/LoadingBarService';

export function initConfig(config: ConfigService): Function {
  return () => config.getAll();
}

@NgModule({
  imports: [
    FormsModule,
    BrowserModule,
    HttpClientModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    DashboardModule,
    AngularDraggableModule,
    DashboardRoutingModule,
    AdminModule,
    MasterProjectRoutingModule,
    MasterProjectModule,
    ContractRoutingModule,
    ContractModule,
    InputsModule,
    DialogModule,
    UploadModule,
    ToastrModule.forRoot(),
    NgxPermissionsModule.forRoot(),

    // App Core & Shared
    CoreModule,
    SharedModule,
    ModalModule.forRoot()
  ],
  exports: [SharedModule],
  declarations: [
    AppComponent,
    ProgressBarComponent,
    HeaderComponent,
    FAQComponent,
    AcknowledgementsComponent
  ],
  providers: [
    Title,
    LoadingBarService,
    EmailService,
    CanDeactivateGuardService,
    RepositoryService,
    ServiceLocator,
    ConfigService,
    NgxRolesService,
    NgxPermissionsService,
    {
      provide: APP_INITIALIZER,
      useFactory: (http: HttpClient, configService: ConfigService, rs: NgxRolesService, ps: NgxPermissionsService ) => function() {
        return configService.getAll().then((config) => {
          return http.get(`${config.BaseApiURL}GetMyRoles`,
            { withCredentials: true }).do((roles: any) => {
            for (const role of roles.value as Array<Role>) {
              rs.addRole(role.Name, role.Permissions);
              ps.addPermission(role.Permissions);
            }
          }).toPromise()
        });
      },
      deps: [HttpClient, ConfigService, NgxRolesService, NgxPermissionsService],
      multi: true
    }
  ],
  bootstrap: [
    AppComponent]
})
export class AppModule implements OnInit {
  constructor(
    readonly router: Router,
    readonly activatedRoute: ActivatedRoute,
    readonly titleService: Title,
    readonly loadingBarService: LoadingBarService,
    private injector: Injector) {    // Create global Service Injector.
    ServiceLocator.injector = this.injector;
  }
}

main.ts

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from '@app/app.module';
import { environment } from '@env/environment';

if (environment.production) {
  enableProdMode(); 
}

platformBrowserDynamic().bootstrapModule(AppModule);

Solution

I reverted to a previous commit and re-applied the updates while ensuring it still built between each update. Didn't see the error again.

Answered By - James L.