Problems with ngModule when using Angular 4

Question

I have an Angular (2) application configured with webpack that imports modules from another shared repository.

So, the general repository has a common.module.ts file with something like this:

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

and then in my main application I import this into my app.module.ts

 @NgModule({ imports: [ ... CommonModule, ], declarations: [...], providers: [...], bootstrap: [AppComponent] }) export class AppModule { } 

This works fine, as in Angular2, but then I try to switch to Angular 4.0 in my main project (without touching the general repository, as it is used by other repositories that are also not portable). So I change my versions in my .json package and rebuild, and everything seems fine, but then when I download the application in the browser, I get this

Fault Error: Unexpected value of "CommonModule" imported by "AppModule" module. Add a note @NgModule.

Does anyone know what is going on? CommonModule is already declared using @NgModule. I checked node_modules in case and something was wrong with the imported files and found common_module.d.ts that contains

 ... export declare class CommonModule {} 

but it’s wonderful for me that the trunk file and decorator have been deleted here.

Any ideas?

Answer 1

Ok, I finally got help on Angular github to get it working.

So, I needed to change the dependencies in my general project to use any angular> 2.0.0 library like this

 "dependencies": { "@angular/core": ">=2.0.0", "@angular/common": ">=2.0.0", "@angular/router": ">=3.0.0", "@angular/http": ">=2.0.0", "@angular/platform-browser": ">=2.0.0", 

I run yarn to update the dependencies and then push the changes to my github registry.

Once in my application project, I updated my shared library yarn upgrade my_github_repo/common#feature/angular4 (feature / angular4 is the name of the branch in my shared project where I clicked the changes)

and that he, therefore, in my project 4.0.0 uses only one angular library that my application uses.

I tested this with another application with angular 2.0.0, which also uses a shared library, in which case the angular version in my node_modules is 2.0.0, so everything is fine.