Wie verwende ich einen Stream als Eingabe für Browserify?

Question

In Gulp, ich versuche, TypScript zu kompilieren, verketten es, dann führen Sie es durch Browserify, um die require s (dann nach dem Igl im Produktionsmodus).

This sample code ist das nächste was ich gefunden habe, was ich versuche zu tun, aber es verwendet eine Zwischendatei. Ich würde lieber die Dinge im Stream behalten, um den Overhead der Zwischendatei möglichst zu vermeiden.

Da Browserify einen Stream ausgibt, scheint es, als ob er wissen sollte, wie man einen Stream akzeptiert.

Der entsprechende Code:

var gulp = require('gulp'); 
var browserify = requ 
var concat = require('gulp-concat'); 
var sourcemaps = require('gulp-sourcemaps'); 
var transform = require('vinyl-transform'); 
var typeScript = require('gulp-typescript'); 

gulp.task('scripts', function() { 
    return gulp.src([mySrcDir,'typings/**/*.d.ts']) 
     .pipe(sourcemaps.init()) 
     .pipe(typeScript(typeScriptProject)) 
     .pipe(concat('main.js')) 
     .pipe(transform(function (filename) { 
      return browserify(filename).bundle(); 
     })) 
     .pipe(sourcemaps.write()) 
     .pipe(gulp.dest(ns.outDir)) 
     // Reload, notify... 
     ; 

Das Ergebnis:

Error: Cannot find module 'C:\path\to\project\root\src\main.js' in 'C:\path\to\project\root'

Wenn ich Verkettung nicht angeben, wird das Ergebnis das gleiche, nur mit foobar.js statt main.js wo foobar.ts ist einer der Eingabedateien.

Ein zweiter Versuch

gulp.task('scripts', function() { 
    var stream = gulp.src([mySrcDir,'typings/**/*.d.ts']) 
     .pipe(sourcemaps.init()) 
     .pipe(typeScript(typeScriptProject)) 
     .pipe(concat('main.js')); 
    var bundleStream = ns.browserify(stream).bundle().on('error', errorHandler); 
    // and then... 

ein neuer Fehler

C:\path\to\project\root\_stream_0.js:1 
[object Object] 
     ^
ParseError: Unexpected token 

Answer 1

geschrieben beziehen Sie können keinen vinyl Stream browserify passieren. Es akzeptiert nur text oder buffer Streams. Die einzige Lösung ist, den Eingang vinyl Strom zu einem text Strom zu transformieren, dass browserify erfassen kann:

var gutil = require('gulp-util') 
var through = require('through2') 
var intoStream = require('into-stream') 

// ... 
.pipe(through.obj(function(file, encoding, next) { 
    bundle = browserify(intoStream(file.contents)) 
    this.push(new gutil.File({ 
    path: 'index.js', 
    contents: bundle.bundle() 
    })) 
    next() 
})) 

Answer 2

einen Blick auf gulp-browserify es einen Schluck Plugin für browserify.

Beispiel:

gulp.src([mySrcDir,'typings/**/*.d.ts']) 
    .pipe(sourcemaps.init()) 
    .pipe(typeScript(typeScriptProject)) 
    .pipe(concat('main.js')) 
    .pipe(browserify(options) 
    .pipe(sourcemaps.write()) 
    .pipe(gulp.dest(ns.outDir)) 
    // Reload, notify... 
    ; 

für Optionen, die Sie auf den Link oben