Fehler beim Laden von xxx.component.html

Question

Ich stehe vor einem seltsamen Problem. Als mein Modul wächst, habe ich beschlossen, einige Unterordner zu erstellen und Unterordner in meine Komponenten einzufügen.

Hier ist meine neue Struktur:

claimfile/ 
    appendix-tabs/ 
     appendix-tabs.component.html 
     appendix-tabs.component.ts 
    quick-create/ 
     quick-create.component.html 
     quick-create.component.ts 
    claimfile.component.html 
    claimfile.component.less 
    claimfile.component.ts 
    claimfile.module.ts 

Ich benutze Webpack, und ich geben alle meine styleUrls und templateUrl mit relativen Pfaden. Aber jetzt, ich habe diese Nachricht:

zone.js?fad3:1274 GET http://192.168.33.10:7777/appendix-tabs.component.html 404 (Not Found) 

Unhandled Promise rejection: Failed to load appendix-tabs.component.html ; Zone: <root> ; Task: Promise.then ; Value: Failed to load appendix-tabs.component.html 

undefinedError: Uncaught (in promise): Failed to load appendix-tabs.component.html(…) 

Es kommt aus der Blinddarm-Komponente, die seine Vorlage nicht laden kann:

Anhang-tabs.component.ts:

import { Component } from '@angular/core'; 

@Component({ 
    selector: 'prop-appendix-tabs', 
    templateUrl : './appendix-tabs.component.html' 
}) 
export class AppendixTabsComponent { 

    constructor() {} 
} 

Um es funktionieren zu lassen, muss ich den absoluten Pfad von meinem index.html angeben:

templateUrl : 'app/claimfile/appendix-tabs/appendix-tabs.component.html' 

Nun, was ich nicht verstehe ist, dass ... es funktioniert perfekt für die schnell erstellen Komponente. Und es gibt nichts anderes in der Dekorateur:

Schnell create.component.ts:

import { Component } from '@angular/core'; 

@Component({ 
    selector: 'prop-claimfile-quick-create', 
    templateUrl: './quick-create.component.html' 
}) 
export class QuickCreateComponent { } 

Es ist auch für den claimfile.component arbeiten, die die Bootstrap-Komponente des Moduls ist.

Eine andere Sache: wenn ich den absoluten Pfad einstelle und die Vorlage bearbeite, wird das Live-Nachladen nicht ausgelöst, es ist, als ob die Datei nicht von Webpack angeschaut worden wäre. Auch ich nicht moduleId: module.id in der Komponente verwenden, da es nicht mit Webpack

compiler.umd.js?9df7:13350 Uncaught TypeError: uri.match is not a function 

Irgendwelche Ideen scheint zu funktionieren, woher es kommen könnte? Es ist nicht das erste Mal passiert es, ich habe bereits diese Art von Problem erfahren

Thx für Ihre Hilfe

Answer 1

ich diese problem.It hatte nur plötzlich ohne Erklärung erschien :(

fand ich, dass die Verwendung erfordern auf die Vorlage es sofort behoben Keine Ahnung, warum ....

@Component({ 
    selector: 'home', 
    template: require('./home.component.html') 
}) 
export class HomeComponent {} 

}