Как импортировать компонент из библиотеки (в nrwl / nx с Angular)

Я хочу импортировать свой PageNotFoundComponent из моей ui-components библиотеки в маршрутизатор моего приложения.

Когда я импортирую UiComponentsModule в свой AppModule и использую компоненты в своем шаблоне, все работает нормально, но импортировать компонент в нотации es6 не удается.

/libs/ui-components/src/lib/ui-components.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'; я получаю ошибку линтера:

импорт библиотеки должен начинаться с @ frontend / (nx-enforce-module-boundaries) tslint (1) Пути импорта подмодулей из этого пакета запрещены; вместо этого импортировать из корня (no-submodule-imports) tslint (1) Модуль 'libs' не указан как зависимость в package.json (no-implicit-dependencies) tslint (1)

Когда я меняю импорт на import { NotFoundComponent } from '@frontend/ui-components';, я получаю сообщение об ошибке:

Модуль '"../../../../../../../../../Users/LeitgebF/Projects/KLAITONWeb/frontend/libs/ui-components/src"' имеет нет экспортированного члена NotFoundComponent.ts (2305)

Итак, как мне импортировать компоненты прямо из библиотеки в Nx?


person Florian Leitgeb    schedule 28.06.2019    source источник


Ответы (1)


Мне тоже нужно добавить желаемый компонент в свой файл ствола. Вот ответ напрямую от поддержки репозитория github: https://github.com/nrwl/nx/issues/1533

Я не понимаю, зачем мне для этого нужен модуль Angular, но я создаю его и экспортирую также другие компоненты в файл ствола.

person Florian Leitgeb    schedule 01.07.2019
comment
Вы узнали ответ на вопрос, зачем вообще импортировать в ngModules? У меня такой же вопрос, как и у вас на гитхабе. - person Vato; 09.01.2021