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: SampleModule is not an NgModule #3426

Closed
beeman opened this issue Dec 6, 2016 · 95 comments
Closed

Error: SampleModule is not an NgModule #3426

beeman opened this issue Dec 6, 2016 · 95 comments

Comments

@beeman
Copy link
Contributor

@beeman beeman commented Dec 6, 2016

OS?

macOS Sierra

Versions.

angular-cli: 1.0.0-beta.22
node: 7.2.0
os: darwin x64

Repro steps.

1. Scaffold new app:

$ ng new angular-sample-app --skip-git --skip-npm --style=scss --inline-template
$ cd angular-sample-app
$ yarn
$ git init
$ git add .
$ git commit -am "Initial commit"

2. Add dependency to angular-sample-module

This source to this module can be found here, and it's available on npmjs.

$ yarn add angular-sample-module

3. Add new module to AppModule

  • Edit src/app/app.module.ts
  • Add dependency: import { SampleModule } from 'angular-sample-module';
  • Add SampleModule to the imports array
  • Edit src/app/app.component.ts
  • Add <sampleComponent></sampleComponent> to the template

4. Start ng serve

$ ng serve
** NG Live Development Server is running on http://localhost:4200. **
 10% building modules 2/2 modules 0 active(node:18364) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: SampleModule is not an NgModule
(node:18364) DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
 20% building modules 84/84 modules 0 active

The log given by the failure.

(node:17462) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: SampleModule is not an NgModule
(node:17462) DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

Mention any other details that might be useful.

Downgrading to the previous version of angular-cli makes it work:

$ npm install --save-dev angular-cli@1.0.0-beta.21

Link to a sample app showing the issue: https://github.com/beeman/angular-sample-app

Using ng new angular-sample-app without my custom parameters on version 1.0.0-beta.22 and npm install over yarn add yields the same results.

@bgauvey
Copy link

@bgauvey bgauvey commented Dec 6, 2016

Same issue on Windows10 x64

@tarlepp
Copy link

@tarlepp tarlepp commented Dec 6, 2016

Yeah I can also confirm that updating angular-cli to 1.0.0-beta.22-1 causes this problem. Any solutions ?

@pascaloo7
Copy link

@pascaloo7 pascaloo7 commented Dec 6, 2016

+1

@shaahink
Copy link

@shaahink shaahink commented Dec 6, 2016

same here

@intellix
Copy link
Contributor

@intellix intellix commented Dec 6, 2016

Been getting this in a few places. I was convinced it was my code but after trying to give it TS directly and seeing everyone complain here, I'm happy it's not just me. Probably spent a minimum of 10hrs here :) It doesn't seem to be very debuggable which is my issue. It just says: X is not an NgModule and it's not even possible to see WHY or how it's even trying to load stuff. I don't even have the ability to pass in module-resolutions parameters to typescript to try and see what it's trying to load which makes this a bitch :(

@jkuri
Copy link
Contributor

@jkuri jkuri commented Dec 6, 2016

Had same issue with this and it is related to incompatibility of Angular versions between 2.2.* and
previous versions, so; update https://github.com/beeman/angular-sample-module/blob/master/package.json#L32-L33 to 2.2.3 which you have in your project and this will get compiled.
Summary is that 3rd party libs package.json should have same version of Angular than your project.

@Adrriver
Copy link

@Adrriver Adrriver commented Dec 7, 2016

I'm getting this error with 2.2.3 having already been set.

@jkuri
Copy link
Contributor

@jkuri jkuri commented Dec 7, 2016

I tried with an example project that @beeman man provided here and updated package.json in https://github.com/beeman/angular-sample-module and it got compiled.

spend a lot of time too some week ago on real world app and this solved the issue too.

@Adrriver
Copy link

@Adrriver Adrriver commented Dec 7, 2016

Interesting. I just installed the latest version of Angular-Cli from Github, and was able to serve the included app. I changed core and common, and received the same error message. After replacing the entire contents with the beeman's sample, and updating core and common versions, I get "must be inside an angular-cli project to use build..." Changing a few parameters to make it more general in it's operation, and removing the main: and typings: declarations didn't help... Anyone have an idea of what's causing this? I'm using node 4.x.x. Thanks.

@MrJuliuss
Copy link

@MrJuliuss MrJuliuss commented Dec 7, 2016

Hello, same issue with 1.0.0-beta.22 on macOS Sierra. And it works fine on 1.0.0-beta.21

@mp3sii
Copy link

@mp3sii mp3sii commented Dec 7, 2016

Same thing happened to me 1.0.0-beta.22

@lurock
Copy link

@lurock lurock commented Dec 7, 2016

It seems like typescript@2.1.1 is causing the issue. Downgrading to 2.0.10 seems to make it pick up the metadata correctly.

@beeman
Copy link
Contributor Author

@beeman beeman commented Dec 7, 2016

@lurock I encountered this bug running on TypeScript version 2.0.10:

~/workspace/beeman/angular-sample-app master
❯ grep version node_modules/typescript/package.json
    "version": "2.0.10",

~/workspace/beeman/angular-sample-app master
❯ tsc -v
Version 2.0.10
@Adrriver
Copy link

@Adrriver Adrriver commented Dec 7, 2016

@lurock
Copy link

@lurock lurock commented Dec 8, 2016

Try building your project using "ng build --aot" and fix any build errors you have then go back to running "ng serve".

@beeman
Copy link
Contributor Author

@beeman beeman commented Dec 9, 2016

This gives me very similar output.

 ng build --aot
 10% building modules 2/2 modules 0 activeUnexpected value 'SampleModule' imported by the module 'AppModule'
Error: Unexpected value 'SampleModule' imported by the module 'AppModule'
    at /Users/beeman/workspace/beeman/angular-sample-app/node_modules/@angular/compiler/bundles/compiler.umd.js:14675:33
    at Array.forEach (native)
    at CompileMetadataResolver._loadNgModuleMetadata (/Users/beeman/workspace/beeman/angular-sample-app/node_modules/@angular/compiler/bundles/compiler.umd.js:14660:51)
    at CompileMetadataResolver.getUnloadedNgModuleMetadata (/Users/beeman/workspace/beeman/angular-sample-app/node_modules/@angular/compiler/bundles/compiler.umd.js:14636:23)
    at addNgModule (/Users/beeman/workspace/beeman/angular-sample-app/node_modules/@angular/compiler/bundles/compiler.umd.js:12944:43)
    at /Users/beeman/workspace/beeman/angular-sample-app/node_modules/@angular/compiler/bundles/compiler.umd.js:12957:16
    at Array.forEach (native)
    at _createNgModules (/Users/beeman/workspace/beeman/angular-sample-app/node_modules/@angular/compiler/bundles/compiler.umd.js:12956:28)
    at analyzeNgModules (/Users/beeman/workspace/beeman/angular-sample-app/node_modules/@angular/compiler/bundles/compiler.umd.js:12700:16)
    at analyzeAndValidateNgModules (/Users/beeman/workspace/beeman/angular-sample-app/node_modules/@angular/compiler/bundles/compiler.umd.js:12704:20)
    at OfflineCompiler.compileModules (/Users/beeman/workspace/beeman/angular-sample-app/node_modules/@angular/compiler/bundles/compiler.umd.js:12775:20)
    at CodeGenerator.codegen (/Users/beeman/workspace/beeman/angular-sample-app/node_modules/@angular/compiler-cli/src/codegen.js:58:30)
    at /Users/beeman/workspace/beeman/angular-sample-app/node_modules/@ngtools/webpack/src/plugin.js:210:73
    at process._tickCallback (internal/process/next_tick.js:103:7)
@DutchKevv
Copy link

@DutchKevv DutchKevv commented Dec 9, 2016

Hi everyone,

It has been taking me days to get a 'production' build, cause of all kind of error..

Some are typescript 2.1.1 related, some Angular 2.2.4 and some to the fact of AOT compiling.

Please also take in mind, when building a production build with --aot.. That export default doesn't work!

angular/angular#11402

You can use all the latest versions of everything, and than not use --aot, made it work for me.

@g00glen00b
Copy link

@g00glen00b g00glen00b commented Dec 9, 2016

Having the same issue after updating a project from Angular CLI 1.0.0-beta.19-3 to the latest (1.0.0-beta.22-1) on macOS Sierra. It appears that the following line is no longer returning anything in node_modules/@ngtools/webpack/src/plugin.js:330:

var ngModules = this._reflector.annotations(staticSymbol).filter(function (s) { return s instanceof core_1.NgModule; });

It looks like the instance of s is not core_1.NgModule.

If I change (monkeypatch) this to the following it works (though probably not the way it should be):

var ngModules = this._reflector.annotations(staticSymbol).filter(function (s) { return s.toString() === "@NgModule" });
@SylTi
Copy link

@SylTi SylTi commented Dec 9, 2016

Same thing here : yuyang041060120/ng2-validation#28

Downgrading to 1.0.0-beta.21 fix the issue

@vadim-shb
Copy link
Contributor

@vadim-shb vadim-shb commented Dec 11, 2016

The same issue. I am trying to start the sample app (full tour of heroes like here: https://embed.plnkr.co/?show=preview) with angular-cli 1.0.0-beta.22-1. When I remove usage of package angular-in-memory-web-api, the application not stuck in building.

"dependencies": {
"@angular/common": "2.2.3",
"@angular/compiler": "2.2.3",
"@angular/core": "2.2.3",
"@angular/forms": "2.2.3",
"@angular/http": "2.2.3",
"@angular/platform-browser": "2.2.3",
"@angular/platform-browser-dynamic": "2.2.3",
"@angular/router": "3.2.3",
"angular-in-memory-web-api": "0.1.16",
"core-js": "^2.4.1",
"rxjs": "5.0.0-beta.12",
"ts-helpers": "^1.1.1",
"zone.js": "^0.6.23"
}

@avatsaev
Copy link

@avatsaev avatsaev commented Dec 11, 2016

Yep, just got bit by this after upgrading typescript to 2.1.4, had to revert back to 2.0.1, which is a bummer, because 2.1.4 has async/await support for es5

@lygstate
Copy link

@lygstate lygstate commented Dec 12, 2016

Also need this.

@mischkl
Copy link

@mischkl mischkl commented Dec 12, 2016

Isn't this exactly the kind of thing Angular CLI is supposed to help with, making sure that all of the versions being installed fit with each other? Seems like a big fail atm.

@zawor
Copy link

@zawor zawor commented Dec 12, 2016

Just a sec ago switched Ubuntu to Win10 and made a ng serve on same source. To my surprise this dragon jumped out of the bushes to bite my arse. On Ubuntu 16.10 it works like a charm. What is more, I have not noticed anyone here from any Linux distro (or no one managed to state it clear enough). So probably it is somehow platform dependent. How? don't know... :P

My setup is pretty much ToH based. Running on:

node: 7.2.1
ng: 2.2.3
ts: 2.1.4
ng-cli: 1.0.0-beta.22-1
@intellix
Copy link
Contributor

@intellix intellix commented Dec 12, 2016

@filipesilva or @hansl - is this something to do with angular-cli or with each of the projects themselves? Two example external deps which are giving this error for me are:

Would be nice to get your insight to if this is possible to fix in the next version as it's quite painful at the moment :)

@vangorra
Copy link

@vangorra vangorra commented Dec 12, 2016

@zawor
Copy link

@zawor zawor commented Dec 12, 2016

ok my bad... sorry for confusion... double checked the versions... Ubuntu was running on outdated typescript 2.0.10 not 2.1.4 but Win had fresh 2.1.4. Now they are in sync and both fail in exact same manner...

@0x1ad2
Copy link

@0x1ad2 0x1ad2 commented Feb 28, 2017

@expy I had it as well, I just updated from BETA to RC. After running an ng build --aot I was able to run ng serve again.

@angular/cli: 1.0.0-rc.0
node: 6.9.1
os: darwin x64
@angular/cli: 1.0.0-rc.0
@angular/common: 2.4.8
@angular/compiler: 2.4.8
@angular/core: 2.4.8
@angular/forms: 2.4.8
@angular/http: 2.4.8
@angular/material: 2.0.0-beta.2
@angular/platform-browser: 2.4.8
@angular/platform-browser-dynamic: 2.4.8
@angular/router: 3.4.8
@angular/compiler-cli: 2.4.8

@Meligy
Copy link
Contributor

@Meligy Meligy commented Feb 28, 2017

@expy try deleting node_modules then:

npm cache clean
npm install

in the project directory.

@expy
Copy link

@expy expy commented Feb 28, 2017

@0x1ad2 @Meligy I've tried the above, the problem may lie in a Module that isn't up-to-date with the latest Angular2 / Angular-Cli changes.

I've contacted the owner of the Module for more information.

Thanks for you assistance.

@SylTi
Copy link

@SylTi SylTi commented Feb 28, 2017

@expy isn't using SEMVER suppose to prevent exactly that?

@expy
Copy link

@expy expy commented Feb 28, 2017

@SylTi that Module is tested and working on @angular v2.4.1. I upgraded my modules and cli yesterday and this was the only issue.

@rnadler
Copy link

@rnadler rnadler commented Mar 11, 2017

Please see ERROR in PasswordStrengthBarModule is not an NgModule.

The interesting twist here is that ng serve initially fails with this error, but a rebuild is successful! This is reproducible and is not resolved with the different typescript/angular-cli versions mentioned in this thread.

@evansmwendwa
Copy link

@evansmwendwa evansmwendwa commented Mar 11, 2017

Been experiencing this issue in a npm package I am working on and finally managed to fix it by AOT compilation using the ngc compiler.

https://angular.io/docs/ts/latest/cookbook/aot-compiler.html#!#compile

@bentbot
Copy link

@bentbot bentbot commented Jun 5, 2017

I was able to resolve this error by modifying my app.routes. I removed the hashtag reference to internal components on loadChildren routes.

{ path: '/modules', loadChildren: 'app/modules/modules.module#ModulesComponent'}
TO
{ path: '/modules', loadChildren: 'app/modules/modules.module'}

@maximelafarie
Copy link

@maximelafarie maximelafarie commented Jun 22, 2017

Still run into this error with Angular 4.2.3 . Fix it with very strange @winfinit trick 😄 (angular-cli 1.1.3)

@kkaabbaa
Copy link

@kkaabbaa kkaabbaa commented Jun 28, 2017

i compiled library with ngc
For me issue is set options "skipMetadataEmit": false in file tsconfig.aot.json

@yogeshgadge
Copy link

@yogeshgadge yogeshgadge commented Aug 3, 2017

"skipMetadataEmit": false that was it.

@angular-automatic-lock-bot
Copy link

@angular-automatic-lock-bot angular-automatic-lock-bot bot commented Sep 7, 2019

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.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 7, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet