Probleme beim Laden von Aurelia-Elementen

Question

Unsere Umgebung hat ein privates Git-Repository eingerichtet und jspm konfiguriert, um Pakete aus diesem Repository zu installieren. Der Repo verfügt über eine .js, .html und .css-Datei. Jspm bringt alle Dateien in einen Ordner mit @master, der an den Namen angehängt wird, um die Verzweigung wiederzugeben, und speichert sie alle im vorkonfigurierten jspm_packages-Verzeichnis auf meinem Rechner. Es fügt auch eine zweite @ master.js-Datei neben dem Ordner mit Exportanweisungen hinzu (ich habe diese Datei nicht selbst erstellt).

Diese Dateien stellen benutzerdefinierte Elemente dar, die ich in meiner Aurelia-Anwendung verwenden möchte. Es gibt ein .js für das Viewmodel und ein .html für die View (und eine .css-Datei). Wenn ich das benutzerdefinierte Element benutze, bekomme ich eine 404, Datei nicht gefunden, weil system.js nach einer @ master.html Datei sucht, die nicht existiert.

Jspm scheint die Datei @ master.js in config.js zu referenzieren und irgendwie nimmt das eine @ master.html Datei in Aurelia an? Nur eine @ master.js Datei wurde erstellt, als ich das Paket mit jspm installiert habe. Die ursprüngliche .html Datei existiert und lebt in dem Ordner, den ich oben erwähnt habe, aber diese @ master.html Datei ist nicht und ich bin mir nicht sicher 1) wofür diese Datei wäre und 2) warum sie referenziert wird. Es gibt keinen Verweis auf @ master.html in meinem Code.

Ich bin mir nicht wirklich sicher, ob dies ein JSPM-Problem, Aurelia-Problem, System.js-Problem oder eine Kombination von ihnen ist?

Hat noch jemand ähnliche Erfahrungen mit diesen Technologien?

Danke, Chris

Answer 1

Im Wesentlichen Aurelia glaubt Sie Ihre Repo als benutzerdefinierte Element importieren, so dass, wenn Sie das @ importieren master.js es wird für die passende „Ansicht“ auf der Suche davon, was wird davon ausgegangen ist ein Aussichtsmodell.

Es klingt wie Sie müssen Ihr Repository als ein Plugin zu strukturieren. Fügen Sie eine index.js Datei auf der obersten Ebene hinzu und sorgen Sie dafür, dass die configure-Funktion ausgeführt wird, die die gewünschten Komponenten zu globalen Ressourcen machen soll. Stellen Sie sicher, dass Ihre package.json auf Ihre index.js als "Haupt" verweist. Danach müssen Sie ein .plugin ('your-package-name') in der Datei main.js hinzufügen, genau wie jedes andere Plugin.

Ein Beispiel index.js ist etwa so:

import {Options, GLOBAL_OPTIONS, DIRECTION} from './options'; 
import {Dragula} from './dragula'; 
import {moveBefore} from './move-before'; 

export {Dragula, Options, DIRECTION, moveBefore}; 

export function configure(config, callback) { 
    let defaults = new Options(); 
    config.container.registerInstance(GLOBAL_OPTIONS, defaults); 

    if (callback !== undefined && typeof callback === 'function') { 
    callback(defaults); 
    } 

    config.globalResources(['./dragula-and-drop']); 
} 

(von here genommen)