Extracting imports of frequently used modules in a shared module

Ionic Framework Ionic Angular
1

Hi guys,

Today I’ve read a lot about shared modules in Angular-based applications. I think I unterstand the concept (put components and pipes that are frequently used together in one shared module and import the shared module instead of importing every single module every time).

I’ve noticed that almost every page module of my project imports the CommonModule, the FormsModule, the IonicModule and some other modules. To make the import block of such modules smaller I’ve implemented a shared module with following structure:

@NgModule({
  declarations: [],
  imports: [],
  exports: [
    CommonModule,
    FormsModule,
    IonicModule,
    DateFormatPipeModule,
    ReactiveFormsModule
  ]
})
export class SharedModule { }

I’ve imported this shared module in every single page module mentioned above. The app still run correctly, but I’m wondering whether it’s a good way to do so. The examples I’ve seen had at least one component in declarations brackets (in contrast to my shared module). I can go one step further and put the DateFormatPipe in the declarations part of the shared module and eliminate the DateFormatPipeModule (as there won’t be any need to declare it).

I could reduce the number of imports in page modules through this implementation (which is a good thing), but I have the feeling I misunderstood something and can face a problem due to this in the future.

Many thanks in advance for your replies
Valdes