你如何在Gulp任務中使用browserify？

我對Gulp很新，但通過遵循this教程，我設置了一個Gulp任務，它旨在瀏覽特定目錄中的JavaScript文件，並將它們傳送到不同的目錄 - 非常簡單。我看了其他一些教程，但是這個方法似乎是最簡潔的。這裏是我的代碼：你如何在Gulp任務中使用browserify？

var gulp = require('gulp'); 
var browserify = require('browserify'); 
var transform = require('vinyl-transform'); 

gulp.task('js', function() { 
    var browserified = transform(function(filename) { 
    return browserify(filename).bundle(); 
    }); 

    return gulp.src(['./public/js/src/**/*.js']) 
    .pipe(browserified) 
    .pipe(gulp.dest('./public/js/dist')); 
});

上面的代碼非常相似，我已經看到了這種許多其他的實現，但是當我嘗試用gulp js運行它，它會產生以下錯誤：

[15:47:13] Using gulp file 
~/development/launchpad/workshop/gulpfile.js 
[15:47:13] Starting 'js'... 
_stream_readable.js:540 
    var ret = dest.write(chunk); 

      ^
TypeError: undefined is not a function 
    at Producer.ondata (_stream_readable.js:540:20) 
    at Producer.emit (events.js:107:17) 
    at Producer.Readable.read (_stream_readable.js:373:10) 
    at flow (_stream_readable.js:750:26) 
    at resume_ (_stream_readable.js:730:3) 
    at _stream_readable.js:717:7 
    at process._tickCallback (node.js:355:11)

有誰知道什麼可能會導致此錯誤？（注意，我想查看堆棧跟蹤中的文件，試圖找出這裏發生的事情，但是在Spotlight中搜索_stream_readable.js會產生大約20個該名稱的文件，所有這些看起來都很不錯有沒有辦法確定堆棧跟蹤中文件的完整路徑？）

來源

2015-10-22 Jordan Schalm

我有完全一樣的問題。 – ceremcem

不幸的是，這是browserify/gulp的問題，並且有nothing that vinyl-transform可以做。該解決方案是使用vinyl-source-stream和vinyl-buffer：

var gulp = require('gulp'); 
var browserify = require('browserify'); 
var source = require('vinyl-source-stream'); 
var glob = require('node-glob'); 

gulp.task('browserify', function (cb) { 

    glob('./src/**/*.js, {}, function (err, files) { 

    var b = browserify(); 
    files.forEach(function (file) { 
     b.add(file); 
    }); 

    b.bundle(). 
     .pipe(source('output.js')) 
     .pipe(gulp.dest('./dist')); 

    cb(); 
    }) 
});

更多信息here。

來源

2016-07-24 05:32:51 Michael

鏈接提供了更多信息sais，'vinyl-transform'方法更好，因爲它需要更少的依賴性，所以無論鏈接中的信息發生了變化，還是我失去了一些東西。 – Giedrius

如果您嘗試使用該代碼示例，您會發現「vinyl-transform」解決方案無效，這是Jordan最初遇到的問題。爲了解決這個問題，我們必須使用源碼流（除非有所改變，它現在可以工作）。 – Michael

var browserify = require('browserify'); 
var gulp = require('gulp'); 
var source = require('vinyl-source-stream'); 

gulp.task('browserify', function() { 
    return browserify('lib/front/app.js') 
    .bundle() 
    //Pass desired output filename to vinyl-source-stream 
    .pipe(source('bundle.js')) 
    // Start piping stream to tasks! 
    .pipe(gulp.dest('public/build/')); 
});

來源

2016-07-24 05:48:15

你如何在Gulp任務中使用browserify？

回答

相關問題