typescript - Ein Modul aus einem anderen Paket in Angular 4 importieren

Dies ist eine konzeptionelle Frage.

Ich bin ein absoluter Anfänger sowohl in Angular als auch in npm, also ist dies sicherlich eine grundlegende Frage, aber ich habe überall gesucht und keine Antwort gefunden.

Ich möchte ein kleines Machbarkeitskonzept erstellen, bevor ich ein Projekt starte. Ich möchte ein Paket namens Imported haben und es in einem Paket namens Importer wiederverwenden

Die package.json des Importeurs hat Imported als Abhängigkeit:

"dependencies": {
    ...
    "imported": "file:../Imported",
    ...
}

Imported befindet sich im node_modules-Ordner des Importeurs, wie erwartet.

Ich habe der Angular-Dokumentation zum Wiederverwenden von Modulen gefolgt. Das Beispiel, das sie beschreiben, ist genau das, was ich will, nur dass ich es von innen in einer Abhängigkeit tun möchte.

Also habe ich ImportedAppModule in der app.module.ts von Importer importiert.

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';


import { AppComponent } from './app.component';
import { ImportedAppModule } from 'imported/src/app/app.module';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule, 
    ImportedAppModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Ich habe die Komponente auch in der app.module.ts von Imported exportiert:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';


import { ImportedAppComponent } from './app.component';


@NgModule({
  declarations: [
    ImportedAppComponent
  ],
  imports: [
    BrowserModule
  ],
  exports: [
    ImportedAppComponent
  ],
  providers: [],
  bootstrap: [ImportedAppComponent]
})
export class ImportedAppModule { }

Mit dieser Einrichtung erhalte ich den folgenden Fehler:

FEHLER in ../imported/src/app/app.module.ts Modul konnte nicht erstellt werden: Fehler: \imported\src\app\app.module.ts fehlt in der TypeScript-Kompilierung. Bitte stellen Sie sicher, dass es in Ihrer tsconfig über die 'files'- oder 'include'-Eigenschaft enthalten ist.

Es schien also, dass ich diese Abhängigkeit in tsconfig.app.json einfügen musste. Aber ich habe auch irgendwo gelesen, dass ich sie dort nicht einfügen musste und dass ich sie in das Bootstrap-Array des Importeurs einfügen musste. Ich habe beides ausprobiert, keines davon hat funktioniert, aber das ist in Ordnung, die Konfigurationsdetails liegen außerhalb des Umfangs dieser Frage.

Meine Frage ist, welcher es ist? Was ist der normale Weg, dies zu tun? Bin ich auf dem richtigen Weg? Wenn ja, was ist der nächste Schritt?

Ich habe versucht, ng build --aot im importierten Paket zu verwenden und die Abhängigkeit zum dist-Ordner im Importer hinzuzufügen, aber es schlägt fehl und sagt, dass keine package.json vorhanden ist, also dachte ich, ich könnte es einfach mit jit versuchen. Trotzdem möchte ich wissen, wie man das mit aot macht.

Ich würde wirklich etwas Anleitung zu schätzen wissen. Vielen Dank im Voraus!

Antwort #1

Sie können ng-packagr verwenden, das Ihre Bibliotheken in das Angular Package Format transpiliert.
Führen Sie npm install ng-packagr --save-dev aus.

Beziehen Sie sich auf den Aufbau einer Angular 4-Komponentenbibliothek mit dem Angular CLI und ng-packagr.