Стоит ли добавлять модули в импорт в SharedModule - Angular?

Question

Это мой SharedModule

import { CommonModule } from "@angular/common";
import { NgModule } from "@angular/core";
import { FormsModule, ReactiveFormsModule } from "@angular/forms";
import { IconModule } from "@my-app/components/icon/icon.module";
import { RequiredActionDirective } from "@my-app/directives/required-action.directive";

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

Обратите внимание, что я добавил в Imports только CommonModule а также IconModule. Я сделал это, потому что использую эти модули в своемRequiredActionDirective. НоExports имеет больше модулей, потому что будет использоваться другими модулями, которые будут импортировать SharedModule.

Вопрос: правильно ли я думаю, что мне не нужно добавлять модули в Imports если я не хочу использовать их непосредственно в SharedModule? Или в будущем могут возникнуть проблемы, о которых я сейчас не знаю, потому что теперь все работает правильно?

Answer 1

Вы не должны повторно экспортировать модули без причины, а импортировать только те модули, от которых зависит текущий модуль. Импорт не причиняет вреда, но при экспорте создается ветвь в дереве зависимостей для поставщиков.

После того, как модуль повторно экспортирует модуль, родительский модуль, импортирующий его, не может переопределить этот импорт. Так что в некоторых крайних случаях это может быть проблемой.

Например;

NgModule({
     imports: [HttpClientModule],
     provide: { provide: HTTP_INTERCEPTORS, useClass: ExampleInterceptor, multi: true },
     exports: [HttpClientModule]
})
export class SharedModule {}

Теперь AppModule не может предоставить другой перехватчик.

NgModule({
     imports: [SharedModule],
     provide: { provide: HTTP_INTERCEPTORS, useClass: AppInterceptor, multi: true }
     // ^^ interceptor is ignored
})
export class AppModule {}

Причина в том, что HttpClientModule объявляется в дереве поставщиков в SharedModule уровень и решает все HTTP_INTERCEPTORSс этой точки вниз.

Требование состоит в том, чтобы AppModule следует импортировать HttpClientModule сначала, а затем SharedModule.

NgModule({
     imports: [HttpClientModule, SharedModule],
     provide: { provide: HTTP_INTERCEPTORS, useClass: AppInterceptor, multi: true }
})
export class AppModule {}

Теперь HttpClientModule объявляется на AppModuleуровень и разрешает всех поставщиков вниз, включаяSharedModule. Порядок вimports: [] массив не важен.

Answer 2

NgModule может экспортировать комбинацию собственных объявлений, выбранных импортированных классов и импортированных NgModules.

Не беспокойтесь о реэкспорте чистых служебных модулей. Чистые служебные модули не экспортируют объявляемые классы, которые мог бы использовать другой NgModule. Например, нет смысла повторно экспортировать HttpClientModule, поскольку он ничего не экспортирует. Его единственная цель — добавить поставщиков услуг http в приложение в целом.

Answer 3

Да вы правы. Технически можно даже избавиться от импорта в , но велика вероятность, что некоторым вещам он может понадобиться сейчас или позже, поэтому я бы не рекомендовал это делать.

Также с точки зрения: Обратите внимание, чтоCommonModuleавтоматически добавляется в импорт при создании нового модуля с помощью CLI. Это означает, что он доступен сразу, однако его можно смело удалить, поскольку мы уже экспортируем его вSharedModule. Это может быть полезно при оптимизации избыточного импорта, но на самом деле это зависит от вас.