typescript - Type X er en del av deklarasjonene til 2 moduler: Y og Y! ... i Angular Jest-tester

Når jeg kjører mine Angular Jest-tester, får jeg følgende feil:

"Type InButtonComponent is part of the declarations of 2 modules: InButtonModule and InButtonModule! Please consider moving InButtonComponent to a higher module that imports InButtonModule and InButtonModule. You can also create a new NgModule that exports and includes InButtonComponent then import that NgModule in InButtonModule and InButtonModule."

Jeg har støtt på problemet med «declarations of 2 modules» før, og det er vanligvis en enkel fikse; ikke deklarer den samme komponenten i to forskjellige moduler. Men i dette tilfellet deklarerer JEG IKKE InButtonComponent i to forskjellige moduler. Det er som om Angular klager på at jeg deklarerer komponenten to ganger i SAMME modul? Feilmeldingen gir ingen mening for meg.

Jeg får ikke denne feilen i appen, enten jeg bygger for produksjon eller kjører utviklingsserveren. Likevel, når jeg kjører Jest-testene mine, feiler de.

Hvis det hjelper, her er noen av filene som kan være involvert:

// button.component.ts  single file SCAM
// ...
@NgModule({
  declarations: [InButtonComponent],
  imports: [CommonModule],
  exports: [InButtonComponent],
})
export class InButtonModule {}

// list-filter.component.ts single file SCAM
// ...
@NgModule({
  imports: [CommonModule, InIconModule, InButtonModule],
  declarations: [InListFilterComponent],
  exports: [InListFilterComponent],
})
export class InListFilterComponentModule {}

// listing.module.ts Feature module
// ...
@NgModule({
  declarations: [
    ListingComponent,
    CardGroupedComponent,
    CardViewComponent,
    CardCommonFeatureComponent,
    QuickFiltersComponent,
    ListNotGroupedComponent,
    ListGroupedComponent,
    ListingHeaderComponent,
    ListingListComponent,
    ListingDetailComponent,
    FilterComponent,
    TableViewComponent,
    DetailViewListsComponent,
  ],
  imports: [
    CommonModule,
    FormsModule,
    ReactiveFormsModule,
    InDividerModule,
    InIconModule,
    InCheckboxModule,
    InListingsStatusLabelComponentModule,
    InButtonModule,
    InToggleComponentModule,
    InCarouselModule,
    InFormFieldModule,
    InListFilterComponentModule,
    ListingRoutingModule,
  ],
  providers: [{ provide: QUICK_FILTER_SERVICE, useExisting: ListingQuickFiltersService }],
})
export class ListingModule {}

// filter.component.spec.ts 
// one of the tests that fail with the above error message
describe('FilterComponent', () => {
  let component: FilterComponent;
  let fixture: ComponentFixture<FilterComponent>;

  beforeEach(async () => {
    await TestBed.configureTestingModule({
      imports: [ListingModule, HttpClientTestingModule, RouterTestingModule],
      providers: [DatePipe],
    }).compileComponents();
  });

  beforeEach(() => {
    fixture = TestBed.createComponent(FilterComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

Hva er årsaken til dette problemet, og hvordan kan jeg fikse det?

Relaterte artikler