Angular 2 + mvc core: Ressource konnte nicht geladen werden: Der Server reagierte mit dem Status 404 (Not Found)

Question

Ich versuche, eine neue eckige 2 zu erstellen, und ich bin in ein Problem, wo meine Komponente Vorlagen werfen 404 Fehler und ich kann nicht für das Leben von mir herausfinden, warum.

Ich kann eine Komponente konfigurieren und die Vorlage angeben, aber aus Gründen, die mir gerade entkommen, sehe ich immer wieder, dass die Vorlagen in der Konsole als .js-Dateien referenziert werden.

zum Beispiel ich die folgende Fehlermeldung angezeigt:

Error: (SystemJS) XHR error (404 Not Found) loading http://localhost:5000/app/app.html.js wrapFn@http://localhost:5000/node_modules/zone.js/dist/zone.js:698:34 invokeTask@http://localhost:5000/node_modules/zone.js/dist/zone.js:265:40 runTask@http://localhost:5000/node_modules/zone.js/dist/zone.js:154:57 invoke@http://localhost:5000/node_modules/zone.js/dist/zone.js:335:40 Error loading http://localhost:5000/app/app.html.js as "app/app.html" from http://localhost:5000/app/app.component.js

Jetzt weiß ich, dass ich keine app.html.js haben, aber ich kann nicht herausfinden, warum Winkel versucht, eine Datei zu laden, existiert nicht. Weiter mehr sein fügt nur zu Verwirrung, wenn ich weiß, daß ich meine Vorlage explizit Einstellung app.html als solche

import { Component } from "@angular/core"; 
import { Router } from "@angular/router"; 

const template = require("./app/app.html"); 

@Component({ 
    selector: "alerts", 
    template: template 
}) 

export class AppComponent { 
    constructor(public router: Router) {} 
} 

würde Jede Hilfe sehr geschätzt.

bearbeiten einfach die Komponente auszuschließen ich es auch durch das Entfernen der externen Vorlage vereinfacht haben und die Vorlagen-Markup direkt in das Bauteil setzen und ich immer noch die gleichen Ergebnisse, eckig für eine Datei suchen das ist weder referenzierten oder bestehende:

import { Component } from "@angular/core"; 
import { Router } from "@angular/router"; 

@Component({ 
    selector: "alerts", 
    template: `<alerts></alerts>` 
}) 

export class AppComponent { 
    constructor(public router: Router) {} 
} 

Answer 1

einen viel einfacheren Weg, dies zu tun wäre, um die moduleId:module.id, zu verwenden und daher nicht die

@Component({ 
    moduleId:module.id, // this makes the .html relative to the folder you are in 
    selector: "alerts", 
    templateUrl: app.html 
}) 

erfordern erfordern