Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

"ERROR in Error: No NgModule metadata found for 'AppModule'." After Angular 5.2.1 and CLI 1.6.5 update #9292

Closed
jtsom opened this issue Jan 19, 2018 · 41 comments

Comments

Projects
None yet
@jtsom
Copy link
Contributor

commented Jan 19, 2018

Versions

Angular CLI: 1.6.5
Node: 9.4.0
OS: darwin x64
Angular: 5.2.1
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cdk: 5.1.0
@angular/cli: 1.6.5
@angular/material: 5.1.0
@ngtools/json-schema: 1.1.0
typescript: 2.5.3
webpack: 3.10.0

Repro steps

  • Update npm packages
  • Update CLI
  • Start app - ng s

Observed behavior

ERROR in Error: No NgModule metadata found for 'AppModule'.
    at NgModuleResolver.resolve (/Users/John/Dev/Javascript/Angular/FRC-TimeTracker/node_modules/@angular/compiler/bundles/compiler.umd.js:20277:23)
    at CompileMetadataResolver.getNgModuleMetadata (/Users/John/Dev/Javascript/Angular/FRC-TimeTracker/node_modules/@angular/compiler/bundles/compiler.umd.js:15230:60)
    at visitLazyRoute (/Users/John/Dev/Javascript/Angular/FRC-TimeTracker/node_modules/@angular/compiler/bundles/compiler.umd.js:31169:104)
    at AotCompiler.listLazyRoutes (/Users/John/Dev/Javascript/Angular/FRC-TimeTracker/node_modules/@angular/compiler/bundles/compiler.umd.js:31137:20)
    at AngularCompilerProgram.listLazyRoutes (/Users/John/Dev/Javascript/Angular/FRC-TimeTracker/node_modules/@angular/compiler-cli/src/transformers/program.js:156:30)
    at Function.NgTools_InternalApi_NG_2.listLazyRoutes (/Users/John/Dev/Javascript/Angular/FRC-TimeTracker/node_modules/@angular/compiler-cli/src/ngtools_api.js:44:36)
    at AngularCompilerPlugin._getLazyRoutesFromNgtools (/Users/John/Dev/Javascript/Angular/FRC-TimeTracker/node_modules/@angular/cli/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:248:66)
    at Promise.resolve.then.then (/Users/John/Dev/Javascript/Angular/FRC-TimeTracker/node_modules/@angular/cli/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:565:50)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:160:7)

Desired behavior

App run normally

Mention any other details that might be useful (optional)

Application built and ran just fine before update.

Did try rm -rf node_modules and reinstall, no change.

@keyant

This comment has been minimized.

Copy link

commented Jan 20, 2018

I have faced same error. solved it: clean and reinstall global angular-cli and local angular.

@hassaniftikhar

This comment has been minimized.

Copy link

commented Jan 20, 2018

@keyant
can you put steps

@keyant

This comment has been minimized.

Copy link

commented Jan 20, 2018

steps:
cd to project directory

sudo npm uninstall -g @angular/cli
sudo npm cache verify
sudo npm install -g @angular/cli@latest
rm -rf node_modules dist
npm install --save-dev @angular/cli@latest
npm install

sudo npm update -D && sudo npm update -S
sudo npm install typescript@'>=2.4.2 <2.7.0'
@vupham2909

This comment has been minimized.

Copy link

commented Jan 22, 2018

Tried @keyant 's steps but still got the error No NgModule metadata found for 'AppModule'

@ottosson

This comment has been minimized.

Copy link

commented Jan 24, 2018

I get this error seemingly random. Can't really see that I've changed anything and suddenly it just stops working and throws that error.

As an example: I had a branch in Visual Studio Team Services that built correctly, and when I re-queued the same build, without any changes, the build didn't work anymore...

@FA-tvonmoll

This comment has been minimized.

Copy link

commented Jan 24, 2018

What happens if you upgrade typescript to 2.6.0?

@x2361

This comment has been minimized.

Copy link

commented Jan 24, 2018

Got the same error, in my case it is caused by an import statement:
import NgModule = core.NgModule;

For instance following code report error when build.

import core = require("@angular/core");
import NgModule = core.NgModule;
@NgModule( {....})
export class AppModule {}

And the error is gone if rewrite the code like below:
import core = require("@angular/core");
@core.NgModule( {....})
export class AppModule {}

@Albejr

This comment has been minimized.

Copy link

commented Jan 24, 2018

Unbelievable! It works after just editing any ".ts" file.

cli

@hansl

This comment has been minimized.

Copy link
Collaborator

commented Jan 24, 2018

Hi @jtsom and @Albejr,

Could you provide a project we can use to reproduce this? A github repo would be great.

@ottosson

This comment has been minimized.

Copy link

commented Jan 26, 2018

@Albejr which commit covers this problem?

https://github.com/angular/angular-cli/releases/tag/v1.6.6

  • @angular/cli: add karma-cli as dependency when ejecting (f17c2b3)
  • @angular/cli: allow colon separated schematic name in generate (f9a9d75)
  • @angular/cli: allow for schema-less schematics to be generated (d4dc2e3)
  • @angular/cli: delete node_modules on eject e2e (5c00e1f)
  • @angular/cli: eject now remove all hardcoded paths (53e84fe), closes #9335
  • @angular/cli: exclude nodejs built-ins from process.cwd() resolve (bf87508)
  • @angular/cli: maintain autoprefixer backward compatibility (0f82564)
  • @angular/cli: only force CommonJS if module kind is ES2015 (369f361)
  • @angular/cli: replaced bullet character due to unwanted beeping sounds on windows systems (38db84c)
@bytech-ca

This comment has been minimized.

Copy link

commented Feb 12, 2018

Had the same experience earlier as Albejr, but with forEach. TS would fail to compile the code saying something like 'foreach is not a method of '... but if I left the hang compiler stuck, and changed and saved any TS file, the compile on top of the failed one would work.

In other words, I could never run the program on the first compile. I got around it in other ways (sounds like foreach can have unpredictable results, so TS doesn't like it and so I moved to other means). The compiler behaviour made troubleshooting a problem more difficult...

Using cli 1.6.7 I experienced the 'first compile fails' problem too. It was using the CoreUI framework which I'm still new to... before I could really test the problem, it went away. Perhaps a cache issue or something else, but the symptoms were exact as in my earlier case and as Alberjr describes. Something might still not be fully resolved on this front with 1.6.7...

@captivea-yho

This comment has been minimized.

Copy link

commented Feb 13, 2018

@x2361
You are incredible, it works with your workaround.
Even with @angular/cli Version 1.6.6 does not work

@ghost

This comment has been minimized.

Copy link

commented Feb 13, 2018

I still have this problem with angular 5.2.4 and cli 1.6.7. I did npm cache clean --force, rm -rf node modules and package lock, remove webpack from package.json, fresh npm install and build. Still the problem persists.

@vapits

This comment has been minimized.

Copy link

commented Feb 14, 2018

Update typescript of project to 2.6.2 solved it for me.

npm install --save-dev typescript@2.6.2.

Took sooooo much time to figure out as the solution of deleting cli and cache and reinstalling them was working only partially.

@tingtingli911

This comment has been minimized.

Copy link

commented Feb 15, 2018

@vapits this solved my problem, excellent !

@prasoon-tare

This comment has been minimized.

Copy link

commented Mar 28, 2018

i also faced this error can any one give solution

@hnmmallesh

This comment has been minimized.

Copy link

commented Apr 22, 2018

OMG i can't believe @Albejr solution worked for me.

@csrssrinivas

This comment has been minimized.

Copy link

commented Apr 23, 2018

I finally resolved this issue. Resolution below. :-)

Update the Angular CLI version to latest – as of today it’s 1.7.4

How to check the version of @angular/cli

  • ng --version

Go to the folder and type the following commands to update CLI.

  • npm remove @angular/cli
  • npm install —save-dev @angular/cli@latest

Make sure that the Webpack version is 3.11.0
How to check the version of Webpack

  • npm list webpack

How to update webpack

  • npm remove webpack
  • npm install webpack@3.11.0
@achmedzhanov

This comment has been minimized.

Copy link

commented Apr 24, 2018

I have same problem ...

I solved this problem only when remove globaly installed webpack.

npm uninstall -g webpack

@Amryn

This comment has been minimized.

Copy link

commented Apr 24, 2018

I had the same problem (and the same effect, that the error went away when I edited any .ts file) and the problem was that I imported a module that was already exported via another imported module, like this (where FooSubModule is exported by FooModule):

imports: [
        BrowserModule,
        FooModule,
        FooSubModule
    ],

It's strange in how many different cases this error message appears. More detailed error messages would be highly appreciated.

@pumpersonda

This comment has been minimized.

Copy link

commented Apr 24, 2018

I had a similar problem, but my problem was the name of the module when I was trying to load the module with lazy load. The first letter was in lowercase.

path/to/projects.module#projectsModule

so I changed it like this and it works:
path/to/projects.module#ProjectsModule

@czetsuya

This comment has been minimized.

Copy link

commented Apr 27, 2018

In my case, what caused the problem was a wrongly defined module. I created a SecuredModule and lazy load that module. But I forgot that when you create a module in cli, it will also append the Module word. But sadly this error does not popup in 1.7.x version, instead I have to downgrade to 1.6.x to be able to figure out the problem.

@aelkoussy

This comment has been minimized.

Copy link

commented May 24, 2018

In my case, solved by deleting the node_modules folder , then running:
npm i

@huyinghuan

This comment has been minimized.

Copy link

commented Jun 13, 2018

I have the same issue when i update angular 2.x -> 6.x . I delete the package-lock.json and reinstall node_modules, it work fine now

@xclayl

This comment has been minimized.

Copy link

commented Jun 30, 2018

For me, I had an APP_INITIALIZER function/factory where the function was not "export"ed. Once I exported the function, it started working again.

@sri15941

This comment has been minimized.

Copy link

commented Jul 12, 2018

Hi
I have faced same error please solve it

compiler.js:11792 Uncaught Error: No NgModule metadata found for 'AppModule'.
at NgModuleResolver.push../node_modules/@angular/compiler/fesm5/compiler.js.NgModuleResolver.resolve (compiler.js:11792)
at CompileMetadataResolver.push../node_modules/@angular/compiler/fesm5/compiler.js.CompileMetadataResolver.getNgModuleMetadata (compiler.js:10429)
at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._loadModules (compiler.js:22567)
at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileModuleAndComponents (compiler.js:22548)
at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler.compileModuleAsync (compiler.js:22508)
at CompilerImpl.push../node_modules/@angular/platform-browser-dynamic/fesm5/platform-browser-dynamic.js.CompilerImpl.compileModuleAsync (platform-browser-dynamic.js:143)
at PlatformRef.push../node_modules/@angular/core/fesm5/core.js.PlatformRef.bootstrapModule (core.js:4285)
at Object../src/app/app.module.ts (app.module.ts:141)
at webpack_require (bootstrap:76)
at Object../src/main.ts (environment.ts:15)

@ThongNguyen165

This comment has been minimized.

Copy link

commented Jul 14, 2018

sudo npm install typescript@'>=2.4.2 <2.7.0'
Worked

@JackHitcher

This comment has been minimized.

Copy link

commented Jul 25, 2018

@Albejr your solution worked for me as well.

Even programming languages works with horoscope magics!!!!

@madbonez

This comment has been minimized.

Copy link

commented Jul 28, 2018

@Albejr wth?? how i can llive now with this... helps me too! but its looks bad

@madbonez

This comment has been minimized.

Copy link

commented Jul 30, 2018

huge black box and no 'eject' available.. dance with a red eyes and daemons. sorry i am stucked for a while)

@ramvirsingh

This comment has been minimized.

Copy link

commented Aug 14, 2018

can you post your 'tsconfig.app.json'

@benwinding

This comment has been minimized.

Copy link

commented Aug 20, 2018

ng update @angular/cli

Worked for me

@michahell

This comment has been minimized.

Copy link

commented Aug 30, 2018

After having tried everything related to NPM, I got past this problem by not declaring platformBrowserDynamic as mentioned here:
https://stackoverflow.com/questions/39685179/angular-2-no-ngmodule-metadata-found

which to me, totally makes zero sense 😬 👍

@raphaelcrv

This comment has been minimized.

Copy link

commented Sep 11, 2018

Unbelievable! It works after just editing any ".ts" file.

cli

Same problem as @Albejr tks for the temp workaround

This thinks make my job a special job, it's pretty like y car not start for a engine problem and y open and close the door and the car start work again. LOL

@zzmmbb

This comment has been minimized.

Copy link

commented Sep 12, 2018

难以置信的!只需编辑任何“.ts”文件即可。

CLI

me too

@westonpace

This comment has been minimized.

Copy link

commented Oct 30, 2018

I ran into this exact error. One of the angular modules I was importing (my own custom module) was being built with ng-packagr and was not exporting all of its services in public_api.ts. After adding those services to public_api.ts and reinstalling the module this error went away.

@qmphan

This comment has been minimized.

Copy link

commented Oct 31, 2018

I upgraded my project to Angular7 yesterday and have spent almost a day trying all possible solution but nothing works. I keep seeing thie message ERROR in No NgModule metadata found for 'AppModule'.

The error happens after the success compilation of all assets. Changes made to tsconfig.json doesn't seem to affect the result in any way.

ng build --project=admin --no-progress

Date: 2018-10-31T09:01:37.961Z
Hash: c852709f74070d0f5f6c
Time: 40952ms
chunk {main} main.js, main.js.map (main) 643 bytes [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 105 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.22 kB [entry] [rendered]
chunk {scripts} scripts.js, scripts.js.map (scripts) 232 kB  [rendered]
chunk {styles} styles.js, styles.js.map (styles) 1.62 MB [initial] [rendered]

ERROR in No NgModule metadata found for 'AppModule'.
@alex7egli

This comment has been minimized.

Copy link

commented Nov 22, 2018

Just got this error, I'm on Windows 10. I upgraded angular-cli, core, and material to v7 to try out a new feature. Then I needed to switch to a branch that was still on v6 of everything. I did the following:

  1. deleted node_modules
  2. switched to the branch
  3. did npm install
  4. uninstalled angular-cli globally
  5. install angular-cli at the same version that branch had set in package.json globally
  6. ran ng build
    Got the error "ERROR in No NgModule metadata found for 'AppModule'.". Editing a ts file does not fix it. I don't understand, none of my code has changed, how can the cli just randomly stop working?

I even tried cloning the project into a new directory, doing npm install and then ng build, and got the same error.

UPDATE
Fixed now. I saw that the original npm install had only installed a subset of angular libraries for some reason. I uninstalled angular-cli globally, did npm cache clean --force, re-installed angular-cli globally at the exact version specified in my package.json, then did npm install again, and this time it worked and now I can build.

@alan-agius4

This comment has been minimized.

Copy link
Collaborator

commented Dec 31, 2018

Thanks for reporting this issue. However, you didn't provide sufficient information for us to understand and reproduce the problem. Please check out our submission guidelines to understand why we can't act on issues that are lacking important information.

If the problem persists, please file a new issue and ensure you provide all of the required information when filling out the issue template.

@Surya4DevOps

This comment has been minimized.

Copy link

commented Jan 26, 2019

Unbelievable! It works after just editing any ".ts" file.

cli

This worked for me, Thanks a ton @Albejr, you saved my day.

@aboudard

This comment has been minimized.

Copy link

commented Mar 15, 2019

Hello !
I had the same issue, but it was related to a tsconfig.json.
I'm testing cypress, and I did put a config in the root tsconfig file :

"include": ["./node_modules/cypress"]

I removed it, following cypress recommendations, havint a file in the dedicated /cypress folder with that kind of content :

{
"extends": "../tsconfig.json",
"include": [
"integration/.ts",
"support/
.ts",
"../node_modules/cypress"
]
}

And now it does compile !
Hope that can help anyone.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.