usage with gulp-if

[icylace]

I want to be able to use gulp-jshint with gulp-if but it doesn't seem to work the way I want it to. However, gulp-csslint does work with gulp-if as expected.

In the case of gulp-jshint nothing is reported whereas with gulp-csslint reporting happens as normal.

Here are the relevant parts of my gulpfile.ls:

require! {
  gulp:    \gulp
  csslint: \gulp-csslint
  csso:    \gulp-csso
  _if:     \gulp-if
  jshint:  \gulp-jshint
  ls:      \gulp-livescript
  nib:     \nib
  rename:  \gulp-rename
  stylus:  \gulp-stylus
  uglify:  \gulp-uglify
}

paths =
  scripts:
    src:  \build/app/scripts/app.ls
    dest: \public
  styles:
    src:  \build/app/styles/app.styl
    dest: \public

compressing = true
linting     = true

gulp.task \scripts ->
  gulp.src paths.scripts.src
    .pipe ls bare: true
    .pipe _if linting, jshint!
    .pipe _if linting, jshint.reporter \jshint-stylish
    .pipe _if compressing, uglify!
    .pipe rename \main.js
    .pipe gulp.dest paths.scripts.dest

gulp.task \styles ->
  gulp.src paths.styles.src
    .pipe stylus use: nib!
    .pipe _if linting, csslint \.csslintrc
    .pipe _if linting, csslint.reporter!
    .pipe _if compressing, csso!
    .pipe rename \main.css
    .pipe gulp.dest paths.styles.dest

[yocontra]

Can you include what the compiled output of the gulpfile is?

[icylace]

Sure, here you go:

var gulp, csslint, csso, _if, jshint, ls, nib, rename, stylus, uglify, paths, compressing, linting;
gulp = require('gulp');
csslint = require('gulp-csslint');
csso = require('gulp-csso');
_if = require('gulp-if');
jshint = require('gulp-jshint');
ls = require('gulp-livescript');
nib = require('nib');
rename = require('gulp-rename');
stylus = require('gulp-stylus');
uglify = require('gulp-uglify');
paths = {
  scripts: {
    src: 'build/app/scripts/app.ls',
    dest: 'public'
  },
  styles: {
    src: 'build/app/styles/app.styl',
    dest: 'public'
  }
};
compressing = true;
linting = true;
gulp.task('scripts', function(){
  return gulp.src(paths.scripts.src).pipe(ls({
    bare: true
  })).pipe(_if(linting, jshint())).pipe(_if(linting, jshint.reporter('jshint-stylish'))).pipe(_if(compressing, uglify())).pipe(rename('main.js')).pipe(gulp.dest(paths.scripts.dest));
});
gulp.task('styles', function(){
  return gulp.src(paths.styles.src).pipe(stylus({
    use: nib()
  })).pipe(_if(linting, csslint('.csslintrc'))).pipe(_if(linting, csslint.reporter())).pipe(_if(compressing, csso())).pipe(rename('main.css')).pipe(gulp.dest(paths.styles.dest));
});

[icylace]

I found that the usage example given for lazypipe involves gulp-jshint. I tried using it with my gulp-if scenario and found that it makes for an effective workaround.

var jshint_channel = lazypipe()
  .pipe(jshint)
  .pipe(jshint.reporter, 'jshint-stylish');

gulp.task('scripts', function () {
  return gulp.src(paths.scripts.src)
    .pipe(ls({ bare: true  }))
    .pipe(_if(linting, jshint_channel()))
    .pipe(_if(compressing, uglify()))
    .pipe(rename('main.js'))
    .pipe(gulp.dest(paths.scripts.dest));
});

This is not necessarily the ideal solution but it does work.

[yocontra]

Yes - you need to use it with lazypipe. Data needs to enter the top of the stream, whereas .pipe returns the end of the stream. lazypipe solves this problem well