I want to finally introduce different NgModules into the app. Currently we have one big AppModule
that has everything, and for our new feature/page we want to create a new module. However, the question arises considering shared modules, components, fontawesome icons. What is the best way to share them?
Here is a snippet of the current AppModule
@NgModule({
declarations: [
AppComponent,
... a lot more components here
],
imports: [
BrowserModule,
.. more imports here
],
providers: (
[
TitleCasePipe,
TranslocoDatePipe,
]
)
bootstrap: [AppComponent],
})
export class AppModule {
constructor(library: FaIconLibrary) {
// FONTAWESOME_ICONS is a const array with long list of icons
FONTAWESOME_ICONS.forEach((icon) => {
library.addIcons(icon)
})
}
}
It is ugly I know. Now with the new module VendorsModule
, I need to export the share components, modules into a SharedModule
so I can import it in both AppModule
and VendorsModule
.
Here is the SharedModule
I attempted
@NgModule({
declarations: [
DomainComponent,
.. more components
],
imports: [
ApiModule,
.. more modules
],
providers: (
[
TitleCasePipe,
TranslocoDatePipe,
]
)
exports: [
.. all the shared components and modules
],
})
export class SharedModule {
constructor(library: FaIconLibrary) {
FONTAWESOME_ICONS.forEach((icon) => {
library.addIcons(icon)
})
}
}
Here is AppModule
after using SharedModule
.
@NgModule({
declarations: [
.. other app components
],
imports: [SharedModule, VendorsModule, BrowserModule],
bootstrap: [AppComponent],
})
export class AppModule {}
Here is VendorsModule
@NgModule({
declarations: [VendorsComponent],
imports: [SharedModule],
exports: [VendorsComponent],
})
export class VendorsModule {}
My concern is,
Is it efficient to have to import SharedModule
in each new introduced module (cause I will defiantly need some of the shared components, icons), even though SharedModule
includes components and fontawesome icons that may not be relevant to that module.
I have looked at several articles regarding shared modules but they seem to introduce only the basic use case.
This is more of a side question, I am not sure if this is the best way to import fontawesome icons (not-free) into the app.