webentwicklung-frage-antwort-db.com.de

Angular AOT-Kompilierungsfehler "Modul für Klasse Component '' kann nicht ermittelt werden

Ich habe eine Angular (4.3.2) -Anwendung, auf der ich einen AOT-Build ausführen möchte. Die App wurde mit @angular/cli Erstellt. Ich habe zwei Komponenten, die mit ng generate und ein Modul, in dem beide als Deklaration enthalten sind:

import {PrivateComponent} from './private.component/private.component';

NgModule({
   imports: [
      // other imports
      PrivateRoutingModule
   ],
   declarations: [
      ...some other components, 
      PrivateComponent, 
      AppTopBarComponent
   ]
   // other stuff 
}) 
export class PrivateModule {}

Private Komponente wird auch im Routing des Moduls verwendet:

const routes: Routes = [
  {path: '', component: PrivateComponent, children: // other components}
] 

@NgModule({
   imports: [RouterModule.forChild(routes)] // this is the Angular built-in router module
})
export class PrivateRoutingModule {}

Beachten Sie, wie das Routing in einem anderen Modul definiert und in PrivateModule importiert wurde. Das AppTopBarComponent wird in der Vorlage PrivateComponent's Verwendet. Also werden beide verwendet und deklariert. Aber wenn ich "node_modules/.bin/ngc" -p tsconfig-aot.json Verwende (ich arbeite unter Windows 10), wird folgende Fehlermeldung angezeigt: Cannot determine the module for class PrivateComponent in (path-to-project)/src/app/pages/private/private.component/private.component.ts! Add PrivateComponent to the NgModule to fix it.Cannot determine the module for class AppTopBarComponent in (path-to-project)/src/app/pages/private/app.topbar.component.ts! Add AppTopBarComponent to the NgModule to fix it.. Meine tsconfig-aot.json - Datei ist genau die gleiche wie in der Angular AOT Build Guide .

angulartypescriptangular-cliaotangular-aot
15
Armen Vardanyan

Ich habe tatsächlich eine Lösung gefunden. Das Problem war, dass PrivateComponent in eine andere Datei importiert, aber nicht verwendet wurde.

import { PrivateComponent } from '../private/private.component'; // not used anywhere

Anscheinend versucht ngc alles zu verknüpfen und wird durch einen nicht verwendeten Import verwirrt

16
Armen Vardanyan

Stellen Sie sicher, dass nicht versehentlich zwei Dateien dieselbe Komponente deklarieren

Dies passiert mir oft, wenn ich mich beim Ausführen von ng g c Im falschen Verzeichnis befinde und die falsch generierte Datei nicht sofort lösche.

FEHLER in: Das Modul für die Klasse FeatureBoxGroupComponent kann in S: /.../src/app/common-widgets/feature-widgets/feature-box-group/feature-box-group.component.ts nicht ermittelt werden! Fügen Sie dem NgModule FeatureBoxGroupComponent hinzu, um das Problem zu beheben.

In diesem Beispiel hatte ich FeatureBoxGroupComponent an zwei Stellen definiert:

src\app\common-widgets\feature-widgets\feature-box-group\feature-box-group.component.ts

src\app\feature-widgets\feature-box-group\feature-box-group.component.ts

Natürlich sagt mir die Fehlermeldung genau, mit welcher Datei es ein Problem gibt - aber es ist einfach, einen Blick darauf zu werfen.

Suchen Sie einfach in Dateien nach dem Komponentennamen, um zu sehen, wo auf ihn verwiesen wird, und stellen Sie sicher, dass er nur einmal definiert ist.

24
Simon_Weaver

Ich hatte dieses Problem und es verschwand, als ich ng build Anstatt von ng build --prod.

Anscheinend hatte ich zwei Module, die ich nicht verwendete, aber nicht aus dem App-Ordner gelöscht hatte. Sie wurden auch nicht im Ordner app.module.ts deklariert.

Gemäß der Dokumentation der --prod flag veranlasst den Compiler, ebenfalls eine Dead Code-Eliminierung durchzuführen.

1
kl27driver

Hier ist, wie ich dieses Problem gelöst habe, vorausgesetzt, Sie verwenden VScode.

  1. Schließen Sie alle offenen Registerkarten.
  2. Stop ng serve
  3. Verschieben Sie die angegebenen Komponentenordner mit VScode an einen anderen Speicherort.
  4. Wenn sich Registerkarten nach dem Verschieben öffnen, schließen Sie sie und speichern Sie die Änderungen beim Schließen (Wegen Pfadänderung).
  5. Es sollte jetzt kompiliert werden, wenn Sie ng build Mit --aot Ausführen.

Wenn Sie möchten, können Sie den gleichen Vorgang ausführen, um Ordner wieder an den ursprünglichen Speicherort zu verschieben.

Nachdem ich das Problem behoben hatte, überprüfte ich auch den git diff Und erkannte, dass das Problem in der Hülle lag. Ich habe die Ordnernamen in Großbuchstaben geändert, aber das wurde im Pfad nicht aktualisiert.

0
nPcomp