How do I log errors with Gulp.js?

I'm getting weird errors when I run my default gulp task. I tried to log the errors with plumber but I do something wrong. I can't find a post of someone who had the same error before. Maybe it's too specific.

var gulp = require('gulp');
var sass = require('gulp-sass');
var run = require('gulp-run');
var notify = require('gulp-notify');
var autoprefixer = require('gulp-autoprefixer');
var minifycss = require('gulp-minify-css');

gulp.task('css', function() {
    gulp.src('app/assets/sass/*.scss')
        .pipe(plumber({
            errorHandler: onError
        }))
        .pipe(sass())
        .pipe(autoprefixer('last 10 version'))
        .pipe(minifycss())
        .pipe(gulp.dest('public/css'));

});

gulp.task('default', function() {
    gulp.watch('app/assets/sass/*.scss', function() {
        gulp.run('css');
    });
});

Without plumber I get this error:

stream.js:94
      throw er; // Unhandled stream error in pipe.
            ^
Error: source string:231: error: argument `$alpha` of `rgba($red, $green, $blue, $alpha)` must be between 0 and 1
Backtrace:
 source string:231, in function `rgba`
 source string:231

With plumber I get:

ReferenceError: onError is not defined / plumber is not defined // depending on how I have written it.
    at Gulp.<anonymous> (/home/vagrant/code/larabook/Gulpfile.js:11:27)
    at module.exports (/home/vagrant/code/larabook/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:34:7)
    at Gulp.Orchestrator._runTask (/home/vagrant/code/larabook/node_modules/gulp/node_modules/orchestrator/index.js:273:3)
    at Gulp.Orchestrator._runStep (/home/vagrant/code/larabook/node_modules/gulp/node_modules/orchestrator/index.js:214:10)
    at Gulp.Orchestrator.start (/home/vagrant/code/larabook/node_modules/gulp/node_modules/orchestrator/index.js:134:8)
    at /usr/lib/node_modules/gulp/bin/gulp.js:121:20
    at process._tickCallback (node.js:419:13)
    at Function.Module.runMain (module.js:499:11)
    at startup (node.js:119:16)
    at node.js:906:3

koistya

11 years ago

Level 1

You may want to use 'multistream' or 'stream-combiner' instead of 'plumber'. Check this out:

https://github.com/gulpjs/gulp/blob/master/docs/recipes/combining-streams-to-handle-errors.md

step1step2

11 years ago

Level 2

Hm the error message is still not reliable to my code.

var Multistream = require('multistream');
var uglify = require('gulp-uglify');
var gulp = require('gulp');
var sass = require('gulp-sass');
var run = require('gulp-run');
var notify = require('gulp-notify');
var autoprefixer = require('gulp-autoprefixer');
var minifycss = require('gulp-minify-css');

gulp.task('css', function() {
    var combined = Multistream([
    gulp.src('app/assets/sass/*.scss'),
        uglify()
        .pipe(sass())
        .pipe(autoprefixer('last 10 version'))
        .pipe(minifycss())
        .pipe(gulp.dest('public/css'))
    ]);
    combined.on('error', console.error.bind(console));
    return combined;
});

gulp.task('default', function() {
    gulp.watch('app/assets/sass/*.scss', function() {
        gulp.run('css');
    });
});

TypeError: Invalid non-string/buffer chunk
    at chunkInvalid (_stream_readable.js:383:10)
    at readableAddChunk (_stream_readable.js:137:12)
    at MultiStream.Readable.push (_stream_readable.js:127:10)
    at MultiStream._forward (/home/vagrant/code/larabook/node_modules/multistream/index.js:37:26)
    at DestroyableTransform.onReadable (/home/vagrant/code/larabook/node_modules/multistream/index.js:75:10)
    at DestroyableTransform.emit (events.js:92:17)
    at emitReadable_ (/home/vagrant/code/larabook/node_modules/gulp/node_modules/vinyl-fs/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:448:10)
    at emitReadable (/home/vagrant/code/larabook/node_modules/gulp/node_modules/vinyl-fs/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:444:5)
    at readableAddChunk (/home/vagrant/code/larabook/node_modules/gulp/node_modules/vinyl-fs/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:187:9)
    at DestroyableTransform.Readable.push (/home/vagrant/code/larabook/node_modules/gulp/node_modules/vinyl-fs/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:149:10)
[TypeError: Invalid non-string/buffer chunk]
[TypeError: Invalid non-string/buffer chunk]
[TypeError: Invalid non-string/buffer chunk]
[TypeError: Invalid non-string/buffer chunk]
[TypeError: Invalid non-string/buffer chunk]
[TypeError: Invalid non-string/buffer chunk]
[TypeError: Invalid non-string/buffer chunk]
[TypeError: Invalid non-string/buffer chunk]

step1step2

11 years ago

Level 2

You know anything more reliable than Gulp.js? It doesn't work for me.

[email protected]

11 years ago

Level 1

Surely in your first example you need to define onError

var onError = function (err) {  
  console.log(err);
 };

koistya

11 years ago

Level 1

If you're using 'multistream' or 'stream-combiner' (try it as well), you don't need to use .pipe(..) anymore.

step1step2

11 years ago

Best Answer

Level 2

No this was not the problem. Considering reading https://coderwall.com/p/2qrvsg

it was because "gulp.run() has been deprecated.". "The gulp.run() function will be removed in v4 of gulp, so the above code should be rewritten as."

The Laracast about Gulp is outdated. This is the new syntax:

gulp.task('watch', function () {
    gulp.watch('app/assets/sass/*.scss', ['css']);
});

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

koistya

11 years ago

Level 1

You may want to check gulpfile.js in this project (as an example):

https://github.com/kriasoft/react-seed

(full disclosure: I'm the author)

Please or to participate in this conversation.