Wenn ich eine Datei x.js habe, die wie folgt aussieht:
x.js
%Vor%und ich führe browserify von der Kommandozeile wie folgt aus:
%Vor%Ich erhalte eine Ausgabedatei, die ungefähr so aussieht:
%Vor%Dann in meinem Browser-Code kann ich dies tun:
%Vor%Ich habe tatsächlich zwei Fragen:
1) Dies funktioniert nicht ganz im Browser Ich bekomme den Fehler: "Uncaught Error: Modul './x.js' nicht gefunden". Warum passiert das?
2) Ich möchte das eigentlich im Schluck mit Vinyl-Source-Stream abspielen. Ich habe versucht, so etwas in meinem gulpfile zu tun, aber es funktioniert nicht. Irgendwelche Ideen? Ich bekomme den Fehler 'require is not defined'
%Vor%Update: Sie können auf einen Alias in Ihrem Schalter -r
verweisen Versuchen Sie: browserify -r ./x.js:my-module > bundle.js
Und auf Ihrer Seite: var x = require('my-module');
HINWEIS: Wenn Sie einen Schalter -r auf einem Knotenmodul wie fs oder bis verwendet haben, benötigen Sie für diese keinen Alias, da sie normalerweise einen Namen haben in ihrer package.json Datei.
Siehe node-browserify - extern erfordert für weitere Informationen.
Wenn Sie Ihre x.js so bündeln wollen (mit der Option -r), gibt es ein paar Optionen
1) Nehmen Sie das Skript in Ihre HTML-Seite und bündeln Sie es separat.
Erstellen Sie eine main.js -Datei und fügen Sie Ihr JS hinzu.
Verwenden Sie browserify -x ./x.js > main.js
Mit der Option -x verbindet Browserify Ihre bundle.js als Abhängigkeit.
Dann referenzieren Sie beide JS-Dateien auf Ihrer Seite.
2) Verwenden Sie den von Browserify generierten Namen.
var x = require('0+DPR/');
Siehe Aktualisieren oben, um einen Alias zu erstellen.
Gute Ressource unten, da Sie mit Gulp weiter gehen wollen
Für mehr Gulp + Browserify (verwendet auch Watchify für Liveload) Schau dir den Blog-Beitrag auf Viget an
Eigentlich bist du ziemlich nah dran, bis auf zwei Dinge:
Sie müssen Ihre 'x.js'
mit einem exponierten Namen versehen, den Sie später () verwenden können, z. B .: 'x'
ist in Ihrem Fall eine gute Wahl
anstelle von require('./x.js');
sollten Sie require('x');
Um Ihnen die volle Antwort zu geben:
in lib/x.js
in gulpfile.js
in einem HTML-Dokument ( index.html
)
Ein paar Details zum Schluckrezept:
Ich habe vinyl-transform
anstelle von vinyl-source-stream
verwendet.
Sie können vinyl-source-stream
verwenden, aber Sie müssen daran denken, später in vinyl-buffer
zu pipen, wenn Sie mehr Transformationen mit Plugins haben, die auf gepufferten Vinyl-Dateiobjekten funktionieren (anstatt das Vinyl-Dateiobjekt zu streamen, das vinyl-source-stream
gibt aus)
Was vinyl-transform
macht ist, dass es sowohl gepufferte als auch streaming Vinyl-Datei-Objekte für Sie erledigt.
Tags und Links javascript node.js browserify gulp