"No NgModule metadata found for 'AppModule'" after Upgrade to Angular 5.1.0 and AngularCli 1.6.0

Versions

Angular CLI: 1.6.0
Node: 8.9.1
OS: win32 x64
Angular: 5.1.0
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cdk: 5.0.0
@angular/cli: 1.6.0
@angular/flex-layout: 2.0.0-beta.10-4905443
@angular/material: 5.0.0
@ngtools/json-schema: 1.1.0
@schematics/schematics: 0.0.10
typescript: 2.5.0
webpack: 3.10.0

Repro steps

Upgrade @angular from 5.0.2 to 5.1.0
Upgrade @angular/cli from 1.5.2 to 1.6.0
Run ng serve

Observed behavior

After doing the upgrade, the following error arises. I was able to resolve the issue as described here.

ERROR in Error: No NgModule metadata found for 'AppModule'.
    at NgModuleResolver.resolve (C:\Users\volkende\WebstormProjects\project-name\node_modules\@angular\compiler\bundles\compiler.umd.js:20249:23)
    at CompileMetadataResolver.getNgModuleMetadata (C:\Users\volkende\WebstormProjects\project-name\node_modules\@angular\compiler\bundles\compiler.umd.js:15218:60)
    at visitLazyRoute (C:\Users\volkende\WebstormProjects\project-name\node_modules\@angular\compiler\bundles\compiler.umd.js:31063:104)
    at AotCompiler.listLazyRoutes (C:\Users\volkende\WebstormProjects\project-name\node_modules\@angular\compiler\bundles\compiler.umd.js:31031:20)
    at AngularCompilerProgram.listLazyRoutes (C:\Users\volkende\WebstormProjects\project-name\node_modules\@angular\compiler-cli\src\transformers\program.js:156:30)
    at Function.NgTools_InternalApi_NG_2.listLazyRoutes (C:\Users\volkende\WebstormProjects\project-name\node_modules\@angular\compiler-cli\src\ngtools_api.js:44:36)
    at AngularCompilerPlugin._getLazyRoutesFromNgtools (C:\Users\volkende\WebstormProjects\project-name\node_modules\@angular\cli\node_modules\@ngtools\webpack\src\angular_compiler_plug
in.js:247:66)
    at Promise.resolve.then.then (C:\Users\volkende\WebstormProjects\project-name\node_modules\@angular\cli\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:561:50)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)

Desired behavior

Since no real changes have been made in app.module.ts, as a developer I don’t want to have to take this step

Mention any other details that might be useful (optional)

Before this issue occured, I had to explicitly npm i --save-dev webpack to be able to run ng serve at all (#7334)

Issue Analytics

State:
Created 6 years ago
Reactions:19
Comments:81 (7 by maintainers)

Top GitHub Comments

164reactions

JinsPetercommented, Dec 8, 2017

I got the same error. The issue is fixed only when i manually re installed angular/cli. The webpack should come as a part of @angular/cli.

npm remove webpack
npm install --save-dev @angular/cli@latest.

This should fix your issue. If this didn’t, clear the whole node_modules folder then

npm cache clean --force
npm install
npm install --save-dev @angular/cli@latest

If @angular/cli install fails Retry npm install --save-dev @angular/cli@latest again.

29reactions

evolkmanncommented, Dec 8, 2017

So I reverted what I did earlier today (actually a little git accident, but that’s another story) and updated again. Now I documented every step and took into account the previous answers.

npm i -g @angular/cli@latest
rm -rf node_modules / rd /s /q node_modules
Update project dependencies as follows (manually in package.json):

    "@angular/animations": "5.0.2" -> "5.1.0",
    "@angular/cdk": "5.0.0-rc0" -> "5.0.0",
    "@angular/common": "5.0.2" -> "5.1.0",
    "@angular/compiler": "5.0.2" -> "5.1.0",
    "@angular/core": "5.0.2" -> "5.1.0",
    "@angular/forms": "5.0.2" -> "5.1.0",
    "@angular/http": "5.0.2" -> "5.1.0",
    "@angular/material": "5.0.0-rc0" -> "5.0.0",
    "@angular/platform-browser": "5.0.2" -> "5.1.0",
    "@angular/platform-browser-dynamic": "5.0.2" -> "5.1.0",
    "@angular/router": "5.0.2" -> "5.1.0"

npm cache clear --force
npm cache verify
npm install
The #7334 Error:

Cannot find module 'webpack/lib/node/NodeTemplatePlugin'
Error: Cannot find module 'webpack/lib/node/NodeTemplatePlugin'
    at Function.Module._resolveFilename (module.js:536:15)
    at Function.Module._load (module.js:466:25)
    at Module.require (module.js:579:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (C:\Users\Enzo\WebstormProjects\project-name.de\node_modules\html-webpack-plugin\lib\compiler.js:11:26)
    at Module._compile (module.js:635:30)
    at Object.Module._extensions..js (module.js:646:10)
    at Module.load (module.js:554:32)
    at tryModuleLoad (module.js:497:12)
    at Function.Module._load (module.js:489:3)
    at Module.require (module.js:579:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (C:\Users\Enzo\WebstormProjects\project-name.de\node_modules\html-webpack-plugin\index.js:7:21)
    at Module._compile (module.js:635:30)
    at Object.Module._extensions..js (module.js:646:10)
    at Module.load (module.js:554:32)

npm uninstall webpack
npm install --save-dev --save-exact @angular/cli@latest (from @JinsPeter 's answer)

After all that ng serve and ng build [--prod] work fine.

New findings:

The new described steps are working just fine and may be a workaround
What I originally wrote under Observed Behaviour is no longer needed

What I do not understand:

What do steps 8 and 9 do different versus steps 2, 4 and 6?
Both should remove the dependencies (or at least webpack) and perform a clean reinstall

Hope that information helps

Top Results From Across the Web

Angular 2 : No NgModule metadata found - Stack Overflow

After upgrading to Angular 6, I encountered the "ERROR in No NgModule metadata found for 'AppModule'." with the angular-bootstrap-md package, which requires ...

Angular – All Possible Solutions for 'No NgModule' - Stack 24/7

The error "No NgModule metadata found for 'AppModule'" could be caused by various reason: Moving Angular project folder. Upgrading ...

No Ngmodule Metadata Found For 'Appmodule' After Upgrade ...

The error No NgModule metadata found for 'AppModule' could be caused by various reason: Moving Angular project folder. No NgModule metadata found for...

No NgModule metadata found for 'AppModule' ... when trying t

When trying to serve admin-pro from IntelliJ - or issue ng serve from command line respectively - I get the error message 'No...

no metadata for categoryrepository was found. nestjs - You.com

angular/angular-cli"No NgModule metadata found for 'AppModule'" after Upgrade to Angular 5.1.0 and AngularCli 1.6.0#8798. Created about 5 years ago.