Wie importiert man bower_components mit einer App, die von brunch erstellt wurde?

Question

Ich bin immer noch dabei, mich mit Brunch zurechtzufinden. Ich habe eine grundlegende Klasse und eine Jasmine-Spezifikation erstellt und erfolgreich getestet.

Jetzt ist es an der Zeit, andere Abhängigkeiten zur Verwendung zu importieren, die erste davon wird jQuery sein und $ verfügbar machen. Die Bibliotheken sind bereits konfiguriert und im Verzeichnis bower_components heruntergeladen.

Obwohl meine Konfiguration sich ein wenig weiterentwickelt hat, könnte es nützlich sein, auf das Grundgerüst hinzuweisen, mit dem ich angefangen habe: brunch-with-hipsters.

Wie importiere und mache ich jQuery als $ für meine Coffeescript-Klasse aus bower_components verfügbar?

Answer 1

Also das war ein bisschen eine falsche Fährte.

coffeelint war aktiviert und gab mir Warnungen beim Ausführen von brunch, aber da ich Anfänger bin, machte ich mir keine Sorgen darüber. Trotzdem gab es genug Warnungen, dass sie vom Bildschirm scrollten.

Ich bemerkte, dass ich konfiguriert hatte:

        'js/vendor.js': /^(bower_components|vendor)/
        'js/app.js': /^app/

aber keine vendor.js erschien. Als ich hochscrollte, fand ich diesen Fehler:

Fehler: [Fehler: Komponenten-JSON-Datei ".../bower_components/jquery-simulate/.bower.json" 
muss eine `main`-Eigenschaft haben. Siehe https://github.com/paulmillr/read-components#README]

Ganz einfach, ich musste einen overrides-Abschnitt bereitstellen, weil jquery-simulate keine .bower.json Datei bereitstellt (ich greife direkt von git darauf zu).

Am Ende bedeutete das Beheben dieses Problems, dass vendor.js generiert wurde und $ verfügbar war.

Answer 2

Von Ihrem App-Root npm install -g bower, dann aktualisieren Sie brunch-config.[js|coffee], damit Bower-Komponenten in vendor.js oder app.js über joinTo wie im Brunch-Konfig-Dokument beschrieben, eingeleitet werden.

Sobald die Konfiguration gespeichert ist, wird das Ausführen von brunch watch den Wächter starten und Änderungen an der Anwendung überwachen. Jegliche Änderungen an bower.json oder der App danach werden automatisch Bower-Abhängigkeiten abrufen (falls erforderlich), die Anwendung neu kompilieren und jede verbundene Benutzerschnittstelle live aktualisieren.

Hinweis: Wenn eine Bower-Komponente keinen main-Abschnitt hat, geben Sie einen overrides-Abschnitt an, damit Sie die mains selbst definieren können, wie im read-components beschrieben. Andernfalls erhalten Sie einen Fehler beim Versuch, die App zu erstellen.