"ng build" showing "ERROR in No NgModule metadata found for 'AppModule'" instead of detailed root errors #18424

feng-xiao · 2020-08-02T14:41:15Z

🐞 Bug report

Command (mark with an `x`)

Is this a regression?

Yes, the previous version in which this bug was not present was: ....

Description

In JIT build mode (AOT=false), "ng build" keeps reporting "ERROR in No NgModule metadata found for 'AppModule'" instead of showing detailed root issues - Lambda not supported in 'app-routing.module.ts'

🔬 Minimal Reproduction

Root issue - app-routing.module.ts

import { NgModule } from '@angular/core';
import { PreloadAllModules, RouterModule, Routes } from '@angular/router';

const routes: Routes = [
  {
    path: '',
    loadChildren: () => import('./tabs/tabs.module').then(m => m.TabsPageModule)
  }
];
@NgModule({
  imports: [
    RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
  ],
  exports: [RouterModule]
})
export class AppRoutingModule { }

🔥 Exception or Error

The error caught during grabbing AppModule's metadata. In the error details, it says the error will be reported, but it didn't. Without debugging, I only see error 'ERROR in No NgModule metadata found for 'AppModule' reported by Angular CLI.

🌍 Your Environment



Angular CLI: 10.0.5
Node: 12.16.1
OS: win32 x64

Angular: 10.0.7
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.1000.5
@angular-devkit/build-angular     0.1000.5
@angular-devkit/build-optimizer   0.1000.5
@angular-devkit/build-webpack     0.1000.5
@angular-devkit/core              10.0.5
@angular-devkit/schematics        10.0.5
@angular/cli                      10.0.5
@ngtools/webpack                  10.0.5
@schematics/angular               10.0.5
@schematics/update                0.1000.5
rxjs                              6.6.2
typescript                        3.9.7
webpack                           4.43.0

Anything else relevant?

tsconfig.json


{
  "compileOnSave": false,
  "compilerOptions": {
    "charset": "utf8",
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "module": "esnext",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "importHelpers": true,
    "noFallthroughCasesInSwitch": true,
    "noImplicitReturns": true,
    "noImplicitAny": true,
    "noImplicitThis": true,
    "strict": true,
    "target": "es2015",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2018",
      "dom"
    ],
    "paths": {
      "app/*": [
        "src/app/*"
      ]
    }
  },
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "preserveWhitespaces": false,
    "strictMetadataEmit": true,
    "strictInjectionParameters": true,
    "strictTemplates": true
  }
}

The text was updated successfully, but these errors were encountered:

alan-agius4 · 2020-08-03T10:36:47Z

Hi @feng-xiao,

I did try to replicate issue but I wasn't with the snippet provided above. Can you setup a minimal repro please?

You can read here why this is needed. A good way to make a minimal repro is to create a new app via ng new repro-app and adding the minimum possible code to show the problem. Then you can push this repository to github and link it here.

That being said, it is expected that in JIT mode (AOT false) errors are less accurate and/or certain errors are not reported.

Read more: https://angular.io/guide/aot-compiler#how-aot-works

feng-xiao · 2020-08-03T12:03:50Z

Hi @alan-agius4,

Is there a setting that can output the root errors?

alan-agius4 · 2020-08-03T13:39:05Z

Hi @feng-xiao, I am not following what you mean by setting to output the root errors. When not using AOT, the application is compiled using TSC (TypeScript compiler) which cannot emit Angular related synthetic and semantical errors.

feng-xiao · 2020-08-03T14:00:04Z

Hi @alan-agius4 ,

I've spent couple days to figure out why I kept getting error "ERROR in No NgModule metadata found for 'AppModule'". I finally found the root cause yesterday by debugging the 'ng build' in VS Code debugger. At the beginning, I even didn't realize the error is related to the flag AOT=true. I think the Angular CLI should have a way to emit/report the root errors even when TSC is being used on JIT mode. So developers don't need to spend days to figure it out. If it's not easy for the team to report errors under TSC, I think the message should be revised to be more helpful, e.g. instruct developer to switch to AOT mode to show the root errors that cause "ERROR in No NgModule metadata found for 'AppModule'".

In my case, the root error 'Lambda used in routing' is only happening on JIT mode, AOT accepts the format. So we still need a mean to report the errors in JIT mode. When I debugged the issue, I saw the root error (Lambda method not allowed) is stored in structuralDiagnostics, and it's not reported in JIT mode.

alan-agius4 · 2020-08-03T14:10:33Z

@feng-xiao, both of the above errors are reporting by the Angular Compiler, likely it’s failing when trying to load lazy loading routes.

Can you share a reproduction in how to replicate the error?

instruct developer to switch to AOT mode to show the root errors that cause

Since version 9 AOT is the default for development builds, for both new and existing application.

feng-xiao · 2020-08-05T15:03:21Z

Hi @alan-agius4 , I've uploaded my code to https://github.com/feng-xiao/angular-issues-no-metadata-found. You can follow the instructions below to reproduce the error.

clone the repo
run 'npm i'
run 'ng build', you will get 'Error in No NgModule metadata found for 'AppModule'
change lambda method to a function in 'src/app/app-routing.module.ts' (e.g. loadChildren() { return ....} ), and run 'ng build' again, the error disappear

alan-agius4 · 2020-08-06T08:49:23Z

Hi @feng-xiao,

The issue seems to be caused because you are using the strictMetadataEmit option which is not intended to be used in applications.

See: angular/angular#31893 (comment) and https://angular.io/guide/angular-compiler-options#strictmetadataemit

feng-xiao · 2020-08-06T12:23:54Z

Hi @alan-agius4 , great! Thank you very much for looking into my issues and pointing me to the correct cause! Really appreciate it!

`strictMetadataEmit` option which is not intended to be used for applications. See: https://angular.io/guide/angular-compiler-options#strictmetadataemit Closes #18424

SchnWalter · 2020-08-11T02:24:26Z

Regarding the strictMetadataEmit documentation, I think that it needs to be improved, the first paragraph doesn't make any sense:

When true, reports an error to the .metadata.json file if "skipMetadataEmit" is false. Default is false. Use only when "skipMetadataEmit" is false and "skipTemplateCodeGen" is true.

https://angular.io/guide/angular-compiler-options#strictmetadataemit

angular-automatic-lock-bot · 2020-09-11T08:09:07Z

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}

`strictMetadataEmit` option which is not intended to be used for applications. See: https://angular.io/guide/angular-compiler-options#strictmetadataemit Closes angular#18424

alan-agius4 added the needs: repro steps We cannot reproduce the issue with the information given label Aug 3, 2020

alan-agius4 added needs: investigation Requires some digging to determine if action is needed and removed needs: repro steps We cannot reproduce the issue with the information given labels Aug 5, 2020

alan-agius4 removed the needs: investigation Requires some digging to determine if action is needed label Aug 6, 2020

alan-agius4 added area: ngtools/webpack freq1: low Only reported by a handful of users who observe it rarely type: bug/fix labels Aug 7, 2020

ngbot bot modified the milestone: needsTriage Aug 7, 2020

alan-agius4 added the severity3: broken label Aug 7, 2020

ngbot bot modified the milestones: needsTriage, Backlog Aug 7, 2020

alan-agius4 mentioned this issue Aug 7, 2020

fix(@ngtools/webpack): issue warning when using strictMetadataEmit #18479

Merged

alan-agius4 added severity1: confusing and removed severity3: broken labels Aug 7, 2020

filipesilva closed this as completed in #18479 Aug 10, 2020

angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 11, 2020

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

"ng build" showing "ERROR in No NgModule metadata found for 'AppModule'" instead of detailed root errors #18424

"ng build" showing "ERROR in No NgModule metadata found for 'AppModule'" instead of detailed root errors #18424

feng-xiao commented Aug 2, 2020

alan-agius4 commented Aug 3, 2020

feng-xiao commented Aug 3, 2020

alan-agius4 commented Aug 3, 2020

feng-xiao commented Aug 3, 2020 •

edited

alan-agius4 commented Aug 3, 2020 •

edited

feng-xiao commented Aug 5, 2020

alan-agius4 commented Aug 6, 2020

feng-xiao commented Aug 6, 2020

SchnWalter commented Aug 11, 2020

angular-automatic-lock-bot bot commented Sep 11, 2020

"ng build" showing "ERROR in No NgModule metadata found for 'AppModule'" instead of detailed root errors #18424

"ng build" showing "ERROR in No NgModule metadata found for 'AppModule'" instead of detailed root errors #18424

Comments

feng-xiao commented Aug 2, 2020

🐞 Bug report

Command (mark with an x)

Is this a regression?

Description

🔬 Minimal Reproduction

🔥 Exception or Error

🌍 Your Environment

alan-agius4 commented Aug 3, 2020

feng-xiao commented Aug 3, 2020

alan-agius4 commented Aug 3, 2020

feng-xiao commented Aug 3, 2020 • edited

alan-agius4 commented Aug 3, 2020 • edited

feng-xiao commented Aug 5, 2020

alan-agius4 commented Aug 6, 2020

feng-xiao commented Aug 6, 2020

SchnWalter commented Aug 11, 2020

angular-automatic-lock-bot bot commented Sep 11, 2020

Command (mark with an `x`)

feng-xiao commented Aug 3, 2020 •

edited

alan-agius4 commented Aug 3, 2020 •

edited