Wie ändere ich die Reihenfolge, in der Meteor Javascript-Dateien lädt?

Question

Wenn Sie ein Projekt mit dem Meteor-Framework erstellen, werden alle Dateien zusammengepackt, aber es scheint keine Möglichkeit zu geben, explizit zu sagen: „Ich möchte, dass diese Datei vor dieser geladen wird“.

Nehmen wir zum Beispiel an, ich habe zwei Javascript-Dateien: foo.js Und bar.js.

Die Datei bar.js enthält tatsächlich Code, der von dem darin enthaltenen abhängt foo.js aber Meteor lädt bar.js Vor foo.js, das Projekt brechen.

• In node.js Ich würde einfach verwenden require('./bar') innen foo.js
• Im Browser, ich würde ein setzen <script> Tag zeigt auf foo.js und ein anderer zeigte danach darauf bar.js, um die Dateien in der richtigen Reihenfolge zu laden.

Wie können wir das tun? Meteor?

Answer 1

Laut Meteor-Dokumentation werden Dateien derzeit in dieser Reihenfolge geladen:

1. Dateien in [project_root]/lib werden zuerst geladen
2. Dateien werden nach Verzeichnistiefe sortiert.Tiefere Dateien werden zuerst geladen.
3. Die Dateien werden in alphabetischer Reihenfolge sortiert.
4. main.*-Dateien werden zuletzt geladen.

Quelle:http://docs.meteor.com/#structuringyourapp

Answer 2

Keine Lösung für alle Szenarien, aber ich denke, idealerweise würde alles, was von anderem Code abhängt, in einer Meteor.startup-Funktion platziert werden, um sicherzustellen, dass alles bereits geladen ist.

Answer 3

Sie können jederzeit einen JS-Loader wie uns verwenden yepnope.js und fügen Sie es der Datei client.js hinzu.Das funktioniert bei mir.

Answer 4

Ich habe eine Reihe von Dienstprogrammfunktionen, die ich unter einem gemeinsamen Namensraum (js global) strukturiert habe.

D.h.

// utils/utils.js
Utils = {};

und dann in Unterordnern:

// utils/validation/validation.js
Utils.Validation = {};

// utils/validation/creditCard.js
Utils.Validation.creditCard = ... // validation logic etc

Außerdem habe ich eine Menge Code, der Utils und seine Unterobjekte verwendet.

Offensichtlich funktioniert diese Struktur nicht, da Meteor zuerst Unterordner lädt.

Damit es wie erwartet funktionierte, musste ich /subfolder/subfolder/subfolder mit bedeutungslosen Namen erstellen und dann das Stammobjekt in den tiefsten Unterordner schieben und Objekte in Unterordnern verzweigen, die nicht so tief sind.

Es ist für meinen Geschmack äußerst kontraintuitiv und fehleranfällig (angenommen, Sie haben eine Komponente, die noch tiefer in der Ordnerstruktur liegt).

Um dieses Problem zu beheben, habe ich die Q-Bibliothek mit Defers und Promises verwendet.Die Lösung ist immer noch nicht sauber, da Sie dadurch den Code routinemäßig wiederholen und überprüfen müssen, aber Sie haben die volle Kontrolle über die Ladereihenfolge, ohne sich mit der Verzeichnisstruktur herumzuschlagen (Hallo an die Leute, die sagen, dass Sie Meteorcode so organisieren können, wie Sie möchten).

Beispiel:

//utils.js
UtilsDefer = UtilsDefer || Q.defer();
UtilsDefer.resolve({
    // here some root utils stuff
});

//cards.js
// here we'll depend on Utils but don't want to care about directory structure
UtilsDefer = UtilsDefer || Q.defer(); // it will be a) already 
// resolved defer from utils.js, or b) new defer that will
// be resolved later in utils.js
UtilsDefer.then(function(Utils) {
    // do something with utils usage, or for instance add some fields here
    Utils.CreditCardDefer = Utils.CreditCardDefer || Q.defer();
    Utils.CreditCardDefer.resolve({
        // Credit card utils here
    })
});

//someOtherFile.js
// it will be pain to use sub-objects with this method though:
UtilsDefer = UtilsDefer || Q.defer();
UtilsDefer.then(function(Utils) {
    Utils.CreditCardDefer = Utils.CreditCardDefer || Q.defer();
    Utils.CreditCardDefer.then(function(CreditCard) {
        // do stuff with CreditCard _if_ you need to do it on startup stage   
    })
});

Dies ist das Beispiel eines eher engen Anwendungsfalls, da Sie meistens mit der Handhabung dieser globalen Werte innerhalb einiger Benutzerinteraktionsrückrufe zufrieden sein werden Meteor.startup wo alles bereits initialisiert ist.Andernfalls könnte dies eine Lösung sein, wenn Sie in einem sehr frühen Stadium eine detaillierte Kontrolle über die Initialisierungsreihenfolge wünschen.