CODEWITHSUNDEEP
angularnpmangular-cli
Stefan S
Stefan S

Reputation: 123

ERROR in ** is not an NgModule

I have this NgModule:

@NgModule({
    imports: [
        CommonModule
    ],
    exports: [
        SP21LoadingBar
    ],
    declarations: [SP21LoadingBar]
})
export class SP21LoadingBarModule { }

The Cli ist telling me 

ERROR in SP21LoadingBarModule is not an NgModule

Please notice: If i take the code and put it into my project it works fine. But as soon as I take the module (and component) out of my project and put it into a npm package, i get that error.

Angular is used in 2.3.1, Angular CLI 1.0.0-beta.24, Typescript 2.0.10

Upvotes: 10

Views: 9925

Answers (4)

Mher
Mher

Reputation: 1263

I spent 2 days on this problem. Add 

"angularCompilerOptions": {
    "skipTemplateCodegen": true
}

to your tsconfig.json and it will create all necessary metadata files. It works for me.

Upvotes: 0

Lupe
Lupe

Reputation: 232

The FINAL solution:

You must compile your library using the Ahead-Of-Time compiler (ngc). It will add some metadata that allos the project that includes the library to read it.

Please, have a look on the follow links:

https://angular.io/docs/ts/latest/cookbook/aot-compiler.html https://medium.com/@cyrilletuzi/how-to-build-and-publish-an-angular-module-7ad19c0b4464#.9y88ipdk7

Upvotes: 4

Lupe
Lupe

Reputation: 232

It works using the follow dependencies:

{
  "dependencies": {
    "@angular/common": "^2.3.1",
    "@angular/compiler": "^2.3.1",
    "@angular/core": "^2.3.1",
    "@angular/forms": "^2.3.1",
    "@angular/http": "^2.3.1",
    "@angular/material": "^2.0.0-beta.0",
    "@angular/platform-browser": "^2.3.1",
    "@angular/platform-browser-dynamic": "^2.3.1",
    "@angular/router": "^3.3.1",
    "@angular2-material/button": "^2.0.0-alpha.8-2",
    "@angular2-material/card": "^2.0.0-alpha.8-2",
    "@angular2-material/checkbox": "^2.0.0-alpha.8-2",
    "@angular2-material/core": "^2.0.0-alpha.8-2",
    "@angular2-material/icon": "^2.0.0-alpha.8-2",
    "@angular2-material/radio": "^2.0.0-alpha.8-2",
    "@angular2-material/slider": "^2.0.0-alpha.8-2",
    "@angular2-material/tooltip": "^2.0.0-alpha.8-2",
    "@types/google-maps": "3.1.28",
    "angular-sample-module": "^0.1.2",
    "angular2-highcharts": "^0.3.3",
    "atob": "^2.0.3",
    "autopulous-xdom": "^1.0.4",
    "bootstrap": "^3.3.7",
    "btoa": "^1.1.2",
    "core-js": "^2.4.1",
    "hammerjs": "^2.0.8",
    "highcharts": "^5.0.0",
    "jszip": "^3.1.3",
    "ng2-bootstrap": "^1.1.16-9",
    "primeng": "^1.0.1",
    "rxjs": "^5.0.1",
    "ts-helpers": "^1.1.1",
    "xml2js": "0.4.17",
    "xml2js-es6-promise": "1.1.1",
    "zone.js": "^0.7.2"   },   "devDependencies": {
    "@angular/compiler-cli": "^2.3.1",
    "@types/hammerjs": "^2.0.33",
    "@types/jasmine": "2.5.38",
    "@types/jszip": "0.0.31",
    "@types/node": "^6.0.62",
    "@types/pako": "^0.2.31",
    "@types/xml2js": "0.0.32",
    **"angular-cli": "1.0.0-beta.21",**
    "angular-ide": "^0.9.10",
    "codelyzer": "~2.0.0-beta.1",
    "jasmine-core": "2.5.2",
    "jasmine-spec-reporter": "2.5.0",
    "karma": "1.2.0",
    "karma-chrome-launcher": "^2.0.0",
    "karma-cli": "^1.0.1",
    "karma-jasmine": "^1.0.2",
    "karma-remap-istanbul": "^0.2.1",
    "protractor": "~4.0.13",
    "ts-node": "1.2.1",
    "tslint": "^4.0.2",
    "typescript": "~2.0.3"   }
}

I'd say that the problems is on the Angular CLI newest versions. Also the project where the HelloWorld module is defined (the library) is not build using Angular CLI. I've created it based on the follow example: https://www.npmjs.com/package/angular-sample-module

Nevertheless, the "is not an NgModule" message appears when using Angular CLI versions biggers than [email protected]

Upvotes: 0

Jose Enrique
Jose Enrique

Reputation: 609

You must use ngc (@angular/compiler-cli) to compile your library, as opposed to using tsc directly. Is this the case for you?

Upvotes: 1

Related Questions