Ich habe versucht, ein Projekt zu erstellen, das AngularJS , Browserify und Gulp für ein exzellentes Entwicklererlebnis verwendet, eines, das ein verteilbares "Modul" erzeugt (in Angular-Sprache). Die Idee ist, ein selbst dokumentiertes Projekt wie Angular Bootstrap zu haben, das auch eine konsumierbare Distribution für die Verwendung in einer anderen Anwendung erzeugt.
Wir hatten großartige Ergebnisse mit Gulp , aber wir haben Probleme mit browserify/browserify-shim . Außerdem verwenden leider die meisten Beispiele entweder keinen Schluck oder verwenden gulp-browserify , was auf die schwarze Liste gesetzt wurde.
Wir fügen AngularJS und JQuery von Google CDN als <script> -Tags ein und haben "angular" : "global:angular" und "jquery" : "global:$" in unserer browserify-shim config in package.json deklariert, aber wir bekommen "cannot find module" , wenn wir versuchen, var angular = require('angular') und var $ = require('jquery') in unserem Browser-Code zu verwenden (sobald er im Browser läuft).
Ich habe ein Beispielprojekt erstellt, das dieses Problem auf ein Minimum reduziert.
Ein Beispiel-Repository des Codes ist verfügbar unter
Einmal geklont, würden Sie 'npm install' , dann 'bower install' und dann 'gulp' aus dem Stammverzeichnis des Ordners multi-browserify ausführen, um die Dateien zu generieren und den Testserver auszuführen.
Wenn Sie Schluck ausführen, können Sie auf den Live-HTML-Code unter http: //: 4000 / gulp.html
zugreifenJede Hilfe würde sehr geschätzt werden - ich frage mich, ob wir auf einen Bug / ein Problem mit der Schnittmenge von Gulp, Browserify, Vinyl-Source-Stream usw. stoßen, oder wahrscheinlicher, wir tun es einfach nicht hol es doch.
Ist das Abrufen Ihrer Abhängigkeiten von einem CDN eine Voraussetzung? Wenn nicht, könntest du npm für deine Abhängigkeiten verwenden und sie browserisieren lassen, um sie für dich zu verzaubern.
JQuery und Angular sind über npm verfügbar. Wenn Sie also jQuery als Beispiel verwenden, können Sie es einfach in Ihrem package.json deklarieren:
Alternativ dazu können Sie das angegebene Modul installieren und als Abhängigkeit in Ihrer npm install <package> -s -Datei speichern, indem Sie package.json aus dem Verzeichnis ausführen, das Ihre package.json enthält.
Sobald Sie diese Abhängigkeit (und alle anderen gewünschten) installiert haben, können Sie sie wie folgt in Ihrer app.js verwenden:
%Vor%Ganz einfach und ohne bower oder browserify-shim-browserify verwenden zu müssen, werden in Ihrem node_modules-Ordner nach ihnen suchen. Ich habe dies nicht mit eckigen (ich hatte ein Problem versucht, es zu installieren) - aber es ist verfügbar durch npm , also sollte es funktionieren.
Tags und Links angularjs browserify gulp