Ich würde gerne chart.js in einem Aurelia-Projekt verwenden, aber ich bekomme Fehler. Wie füge ich Drittanbieter-Knotenpakete zu einer Aurelia-App hinzu?
Ich benutze Aurelia-cli, BTW
Folgendes habe ich getan
%Vor% In aurelia.json
habe ich folgendes hinzugefügt:
In app.html
füge ich dann die Zeile
Aber ich bekomme den Fehler:
%Vor% Ich habe verschiedene Dinge ausprobiert, wie das Chart in app.html
Und dann habe ich in app.html die folgende require-Anweisung hinzugefügt:
%Vor% Sie können hier ein funktionierendes Beispiel hier auschecken. Anfangs dachte ich, du müsstest das aurelia-chart
Modul benutzen, aber es ist sehr schwierig zu benutzen, und deshalb empfehle ich dir stattdessen Chart.JS
package zu benutzen. So können Sie das Modul chart.js in Ihre Aurelia-App integrieren:
Fügen Sie in aurelia.json
die folgende Zeile zum Abschnitt prepend hinzu
Fügen Sie in der Datei app.js
(oder einer anderen Modellansichtsdatei) die Zeile
Wenn Sie beispielsweise ein Diagramm auf der Startseite anzeigen möchten:
%Vor%Und das ist es!
1. Problem mit require
Bitte verwenden Sie nicht <require from="Chart"></require>
in Ihrem app.html-Projekt. Das ist die Quelle Ihrer Fehlermeldung, da versucht wird, ein Aurelia-Modul zu laden und chart.js ist kein Aurelia-Modul (view / viewmodel) in Ihrem Quellcode.
2. Alternative Importsyntax
Überspringen Sie die inject
-Zeilen in app.js
, aber versuchen Sie eins der folgenden (versuchen Sie jeweils eins nach dem anderen) entweder in app.js
oder in jedes Modul Sie werden Diagramm verwenden. Einer dieser Importe wird wahrscheinlich funktionieren.
3. Legacy vorangestellt
Wenn keiner der obigen Schritte funktioniert, importieren Sie ihn als Legacy Repo mit dem prepend
Abschnitt von aurelia.json
(vor dem dependencies
Abschnitt) wie folgt:
Update für Aurelia-Chart: (hinzugefügt für spätere Zuschauer)
Da Sie mit aurelia-chart (von grofit) gelaufen sind, ist hier der Abhängigkeitscode für aurelia.json
:
Ich habe gerade mit einem Aurelia-CLI-Projekt gearbeitet, und es erforderte einige zusätzliche Modifikationen.
Ich habe au install chart.js
verwendet, aber es gibt ein offenes Problem , das besagt, dass es noch nicht intelligent genug ist, um es hinzuzufügen Verweise auf Paketabhängigkeiten.
Damit alles funktioniert, habe ich meinen aurelia.json-Abhängigkeiten Folgendes hinzugefügt:
%Vor% Ich war dann in der Lage, import { Chart } from 'chart.js';
in meinem View-Modell zu verwenden und das Schnellstartbeispiel chart.js aus der Lifecycle-Methode attached
viewmodel auszuführen.
In den chart.js-Dokumenten, die erwähnt werden, einschließlich der verkleinerten Version können Probleme auftreten, wenn Ihr Projekt bereits von der Moment-Bibliothek abhängig ist.
Die mitgelieferte Version enthält Moment.js, die in dieselbe Datei integriert sind. Diese Version sollte verwendet werden, wenn Sie Zeitachsen verwenden möchten und eine einzelne Datei enthalten möchten. Verwenden Sie diesen Build nicht, wenn Ihre Anwendung Moment.js bereits enthält. Wenn Sie dies tun, wird Moment.js zweimal eingefügt, wodurch die Ladezeit der Seite erhöht wird und möglicherweise Probleme mit der Version auftreten.
Diese Lösung kann helfen, wenn Sie in dieser Position sind.
Tags und Links javascript aurelia