I am currently working on an angular2 website with a root module and a sub level module. However, I have noticed that whatever modules I include in the root module must also be re-included in the sub level module, making them not truly reusable.
This is what my setup looks like:
In the app module
@NgModule({
declarations: [
AppComponent,
ComingSoonComponent,
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
AppRoutingModule,
HomepageModule, //included the homepage module
OwlModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
And in the homepage module
@NgModule({
imports: [
CommonModule,
OwlModule//already in the app module
],
declarations: [HomepageComponent]
})
export class HomepageModule { }
The Owl module is imported twice to make it work. But if I import it only in the app module, then I encounter an error saying:
If 'owl-carousel' is an Angular component, then verify that it is part of this module.
I'm wondering what I might be missing here, as dealing with multiple modules in an application can become cumbersome due to having to duplicate imports.