Problem with js-hint & notify

[Avcajaraville]

So, was the whole day working on our new FE workflow, the main idea is to run a few tasks through a watcher, we will have our IDE's and a window with the browser getting refreshed each time something change.

So, we wont see nothing if all went good: the browser will get reload and we will keep working.

But, we want to use gulp notify for errors, so in case we have something wrong, the notifier pop up will appear, and at that point, you can check the console and see the error.

For our styles tasks, everything works fine, but Im not able to accomplish this for JS files.

Mainly, I cant make jsHint works as I want, which will be like this: you save your js file, if fails, the popup appear and when you see this, you go to the console and you see the output of jshint-stylish.

Can somebody help me ?

This is my (non working) solution:

gulp.task( 'js-hint', function() {
    return gulp.src( config.source )
        .pipe( plumber() )
        .pipe( jshint( config.jsHintRules ) )
        .pipe( jshint.reporter( 'jshint-stylish' ) )
        .on('error', notify.onError( { message: 'JS hint fail' } ) );
});

Obviously, I have a problem with concepts, so, will somebody can please put me on the right direction ?

Note that I just want to emit the same message all the time "JS hint fail"

Then, the console (thanks to jshint-stylish) will gave me more info.

Also, this will be on a watcher.

After JS hint pass, will execute more tasks, like borwserify, so its important that if its stop, "wait" till I finish fixing it and then keep going.

Thanks !

[stephenlacy]

I answered your stack overflow question. Add the fail reporter.

Ref: #10

[Avcajaraville]

Thanks a lot !

This totally put me on the right way.

Since one of my goal is not to output nothing on the console but the jshint-stylish output; I had to write my own error reporter.

So, as far as I understand now, jshint doesn't emit any error event. So I have to do it manually, and then, through plumber, catch the error.

I catch the error through plumber due to a problem solved here : https://github.com/spenceralger/gulp-jshint/issues/28

Inspired by this idea : https://gist.github.com/rudijs/9148283

This is the solution I had now; its working pretty well and does exactly what I wanted. Not sure if that is the best way.

PS: will use this task inside gulp.watch

var gulp        = require( 'gulp' ),
    jshint      = require( 'gulp-jshint' ),
    plumber     = require( 'gulp-plumber' ),
    notify      = require( 'gulp-notify' ),
    config      = require( '../config' ).js,
    notify      = require( 'gulp-notify' ),
    map         = require( 'map-stream' ),
    events      = require( 'events' ),
    stylish     = require( 'jshint-stylish' ),
    emmitter    = new events.EventEmitter();

gulp.task('js-hint', function () {
    gulp.src(config.source)
        .pipe( plumber( { errorHandler: notify.onError( { message: config.errorMessage } ) } ) )
        .pipe( jshint( config.jsHintRules ))
        .pipe( jshint.reporter( stylish ))
        .pipe( jsHintErrorReporter() );
});

var jsHintErrorReporter = function(file, cb) {
    return map(function (file, cb) {
        if (!file.jshint.success) {
            file.jshint.results.forEach(function (err) {
                if (err) {
                    emmitter.emit('error');
                }
            });
        }
        cb(null, file);
    });
};

[yocontra]

@Avcajaraville the fail reporter emits an error event. that's all it does.

[Avcajaraville]

@contra Yes, but it also output messages to the console, that was something we wanted to avoid as well (since there is enough output from jshint-stylish; thats why I needed a custom stylish. I wanted to be sure that its written on the best way and that I understood the idea behind.

[yocontra]

@Avcajaraville Does it? Sounds like an issue that should be opened to disable that