typescript - Bir kütüphaneden bir bileşen nasıl içe aktarılır (nrwl/nx ile Angular'da)


Uygulamamın yönlendiricisine ui-components kütüphanemden PageNotFoundComponent bileşenini ithal etmek istiyorum.

UiComponentsModule'ü AppModule'e aktarırken ve bileşenleri şablonumda kullanırken her şey sorunsuz çalışıyor, ancak bir bileşeni es6 notasyonunda aktarmak başarısız oluyor.

/libs/ui-bileşenler/src/lib/ui-bileşenler.module.ts

import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { ContactCardComponent } from './contact-card/contact-card.component';
import { NotFoundComponent } from './not-found/not-found.component';
import { WhiteLabelFooterComponent } from './white-label-footer/white-label-footer.component';
import { WhiteLabelHeaderComponent } from './white-label-header/white-label-header.component';

@NgModule({
  declarations: [
    ContactCardComponent,
    WhiteLabelFooterComponent,
    WhiteLabelHeaderComponent,
    NotFoundComponent
  ],
  exports: [
    ContactCardComponent,
    WhiteLabelFooterComponent,
    WhiteLabelHeaderComponent,
    NotFoundComponent
  ],
  imports: [CommonModule],
})
export class UiComponentsModule {}

/apps/myApp/src/app/app-routing.module.ts

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { NotFoundComponent } from 'libs/ui-components/src/lib/not-found/not-found.component';

const routes: Routes = [
  {
    path: '**',
    component: NotFoundComponent,
  },
];

@NgModule({
  exports: [RouterModule],
  imports: [RouterModule.forRoot(routes)],
})
export class AppRoutingModule {}

import { NotFoundComponent } from 'libs/ui-components/src/lib/not-found/not-found.component'; gibi bir import ile linter hatası alıyorum:

kütüphane ithalatları @frontend/ ile başlamalıdır (nx-enforce-module-boundaries)tslint(1) Bu paketten alt modül ithalat yolları yasaktır; bunun yerine kökten ithalat yapın (no-submodule-imports)tslint(1) 'libs' modülü package.json dosyasında bağımlılık olarak listelenmemiştir (no-implicit-dependencies)tslint(1)

İmportu import { NotFoundComponent } from '@frontend/ui-components'; olarak değiştirdiğimde şu hatayı alıyorum:

Modül '"../../../../../../../../../Users/LeitgebF/Projects/KLAITONWeb/frontend/libs/ui-components/src"' 'NotFoundComponent' adlı bir dışa aktarılmış üyeye sahip değil.ts(2305)

Peki Nx'te bileşenleri bir kütüphaneden doğrudan nasıl içe aktarırım?

Cevap #1

İstediğim bileşeni varil dosyama da eklemem gerekiyor. İşte GitHub depo desteğinden doğrudan gelen cevap: https://github.com/nrwl/nx/issues/1533

Neden bunun için Angular modülüne ihtiyacım olduğunu anlamıyorum, ancak onu oluşturuyorum ve fıçı dosyasında diğer bileşenleri de dışa aktarıyorum.

İlgili makaleler