Object #<Readable> has no method 'write' while using Gulp + Browserify

Question

When following the example recipe from the Gulp.js repository. I get an error:

[12:27:31] Using gulpfile C:\GH\riot-tag-build\Gulpfile.js
[12:27:31] Starting 'browserify'...

_stream_readable.js:602
    var written = dest.write(chunk);
                       ^
TypeError: Object #<Readable> has no method 'write'
    at write (_stream_readable.js:602:24)
    at flow (_stream_readable.js:611:7)
    at _stream_readable.js:579:7
    at process._tickCallback (node.js:442:13)

I have tried to modify the source code to match my requirements and this is the Gulpfile I am trying to run with no luck.

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

gulp.task('browserify', function () {
  // set up the browserify instance on a task basis
  var b = browserify({debug: true});
  // transform regular node stream to gulp (buffered vinyl) stream
  var browserified = transform(function(filename) {
    b.add(filename);
    return b.bundle();
  });

  return gulp.src('./main.js')
    .pipe(browserified)
    .pipe(gulp.dest('./dist/'));
});

gulp.task('default', ['browserify']);

And the whole example can be found from here

Any ideas why the stream might be read-only? Any help appreciated.

Answer 1

I get the same problem. And I find the solution. You just downgrade "browserify" version to the latest 9.0.4. And anything will be ok. You can reference the commit history.

https://github.com/substack/node-browserify/commits/master

====Update====

I solve this error. I use 'through2', the code is as follows.

gulp.src('./src/index.js')
    .pipe(through2.obj(function (file, enc, next){
            browserify(file.path)
                .bundle(function(err, res){
                    // assumes file.contents is a Buffer
                    file.contents = res;
                    next(null, file);
                });
        }))
    .pipe(gulp.dest('./build/'))

The solution is from this issue.

https://github.com/substack/node-browserify/issues/1044

Answer 2

I'm not sure about vinyl-transform, but I guess the correct way of using browserify is to use it as the start point, and transform the stream afterwards to a vinyl object. At least that's what's in the recipes.

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

gulp.task('browserify', function () {
  return browserify({
    debug: true,
    entries: ['./main.js']
  }).bundle()
    .pipe(source('main.bundle.js'))
    .pipe(gulp.dest('./dist/'));
});