Invalid behaviour when using inside lazypipe #32

Closed
Romelyus opened this Issue Jul 3, 2014 · 9 comments

Comments

Projects
None yet
4 participants
@Romelyus

Romelyus commented Jul 3, 2014

var gulp = require('gulp');
var gulpif = require('gulp-if');
var minifyCss = require('gulp-minify-css');
var lazypipe = require('lazypipe');
var args = require('yargs').argv;

var stylesTasks = lazypipe()
    .pipe(plugins.less) // some example code
    .pipe(plugins.autoprefixer, config.autoprefixer.browsers, config.autoprefixer.options) // some example code
    .pipe(gulpif, args.minify, minifyCss); // not working correctly

gulp.task('styles-common', function() {
    return gulp.src('some/src/*.less')
        .pipe(stylesTasks())
        .pipe(gulp.dest('some/dest'));
});
gulp.task('styles-ie', function() {
    return gulp.src('some/src/*.ie.less')
        .pipe(stylesTasks())
        .pipe(gulp.dest('some/dest'));
});
gulp.task('styles', ['styles-common', 'styles-ie']);

gulp styles --minify — in destination folder put two files with similar content

@SevereOverfl0w

This comment has been minimized.

Show comment
Hide comment
@SevereOverfl0w

SevereOverfl0w Jul 15, 2014

+1. I'd like to know how to solve this. I do feel like it is more likely a lazypipe issue however, for not defining an interface which permits sub-tasks.

+1. I'd like to know how to solve this. I do feel like it is more likely a lazypipe issue however, for not defining an interface which permits sub-tasks.

@eduardolundgren

This comment has been minimized.

Show comment
Hide comment
@eduardolundgren

eduardolundgren Jul 21, 2014

This use-case is valid. Adding gulp if to support functions as trueChild and falseChild would do the job, e.g:

'use strict';

var match = require('gulp-match');
var ternaryStream = require('ternary-stream');
var through2 = require('through2');

module.exports = function (condition, trueChild, falseChild) {
    if (!trueChild) {
        throw new Error('gulp-if: child action is required');
    }

    if (typeof condition === 'boolean') {
        // no need to evaluate the condition for each file
        // other benefit is it never loads the other stream
        return condition ? trueChild : (falseChild || through2.obj());
    }

    function classifier (file) {
        return !!match(file, condition);
    }

    if (typeof trueChild === 'function') {
        trueChild = trueChild();
    }

    if (typeof falseChild === 'function') {
        falseChild = falseChild();
    }

    return ternaryStream(classifier, trueChild, falseChild);
};

Then you nesting lazypipe will work fine:

var buildJavaScript = lazypipe()
  .pipe(plugins.uglify, {
    preserveComments: 'some'
  });

var buildJavaScriptWithFilter = lazypipe()
  .pipe(plugins.if, '*.js', buildJavaScript);

This use-case is valid. Adding gulp if to support functions as trueChild and falseChild would do the job, e.g:

'use strict';

var match = require('gulp-match');
var ternaryStream = require('ternary-stream');
var through2 = require('through2');

module.exports = function (condition, trueChild, falseChild) {
    if (!trueChild) {
        throw new Error('gulp-if: child action is required');
    }

    if (typeof condition === 'boolean') {
        // no need to evaluate the condition for each file
        // other benefit is it never loads the other stream
        return condition ? trueChild : (falseChild || through2.obj());
    }

    function classifier (file) {
        return !!match(file, condition);
    }

    if (typeof trueChild === 'function') {
        trueChild = trueChild();
    }

    if (typeof falseChild === 'function') {
        falseChild = falseChild();
    }

    return ternaryStream(classifier, trueChild, falseChild);
};

Then you nesting lazypipe will work fine:

var buildJavaScript = lazypipe()
  .pipe(plugins.uglify, {
    preserveComments: 'some'
  });

var buildJavaScriptWithFilter = lazypipe()
  .pipe(plugins.if, '*.js', buildJavaScript);
@eduardolundgren

This comment has been minimized.

Show comment
Hide comment
@eduardolundgren

eduardolundgren Jul 21, 2014

There is a proposal pull request, let's see what @robrich says about it.

There is a proposal pull request, let's see what @robrich says about it.

@robrich

This comment has been minimized.

Show comment
Hide comment
@robrich

robrich Jul 22, 2014

Owner

I found the solution. Lazypipe doesn't instantiate arguments on each build, it only instantiates the first argument, passing in the remaining arguments. Here's a solution:

var gulp = require('gulp');
var gulpif = require('gulp-if');
var minifyCss = require('gulp-minify-css');
var lazypipe = require('lazypipe');
var args = require('yargs').argv;

var stylesTasks = lazypipe()
    .pipe(plugins.less) // some example code
    .pipe(plugins.autoprefixer, config.autoprefixer.browsers, config.autoprefixer.options) // some example code
    // this line doesn't work: .pipe(gulpif, args.minify, minifyCss);
    // use this instead:
    .pipe(function () {
      return gulpif(args.minify, minifyCss());
    });
    // why does this work? lazypipe calls the function, passing in the no arguments to it,
    // it instantiates a new gulp-if pipe and returns it to lazypipe.

gulp.task('styles-common', function() {
    return gulp.src('some/src/*.less')
        .pipe(stylesTasks())
        .pipe(gulp.dest('some/dest'));
});
gulp.task('styles-ie', function() {
    return gulp.src('some/src/*.ie.less')
        .pipe(stylesTasks())
        .pipe(gulp.dest('some/dest'));
});
gulp.task('styles', ['styles-common', 'styles-ie']);
Owner

robrich commented Jul 22, 2014

I found the solution. Lazypipe doesn't instantiate arguments on each build, it only instantiates the first argument, passing in the remaining arguments. Here's a solution:

var gulp = require('gulp');
var gulpif = require('gulp-if');
var minifyCss = require('gulp-minify-css');
var lazypipe = require('lazypipe');
var args = require('yargs').argv;

var stylesTasks = lazypipe()
    .pipe(plugins.less) // some example code
    .pipe(plugins.autoprefixer, config.autoprefixer.browsers, config.autoprefixer.options) // some example code
    // this line doesn't work: .pipe(gulpif, args.minify, minifyCss);
    // use this instead:
    .pipe(function () {
      return gulpif(args.minify, minifyCss());
    });
    // why does this work? lazypipe calls the function, passing in the no arguments to it,
    // it instantiates a new gulp-if pipe and returns it to lazypipe.

gulp.task('styles-common', function() {
    return gulp.src('some/src/*.less')
        .pipe(stylesTasks())
        .pipe(gulp.dest('some/dest'));
});
gulp.task('styles-ie', function() {
    return gulp.src('some/src/*.ie.less')
        .pipe(stylesTasks())
        .pipe(gulp.dest('some/dest'));
});
gulp.task('styles', ['styles-common', 'styles-ie']);
@SevereOverfl0w

This comment has been minimized.

Show comment
Hide comment
@SevereOverfl0w

SevereOverfl0w Jul 22, 2014

That adds a lot of additional code for each line I wish to to do it. I somewhat prefer the interface @eduardolundgren has provided.

That adds a lot of additional code for each line I wish to to do it. I somewhat prefer the interface @eduardolundgren has provided.

@robrich

This comment has been minimized.

Show comment
Hide comment
@robrich

robrich Jul 22, 2014

Owner

Yeah, I'm not thrilled with the syntax either. I debated creating a
lazypipe init fn that I could pass an argument to. It ended up looking
uglier though. Alas, if an argument to a lazypipe step needs care on each
lazypipe instance, either you have to change every plugin to not need it,
or you need syntax to signal to lazypipe to treat this argument differently.

Owner

robrich commented Jul 22, 2014

Yeah, I'm not thrilled with the syntax either. I debated creating a
lazypipe init fn that I could pass an argument to. It ended up looking
uglier though. Alas, if an argument to a lazypipe step needs care on each
lazypipe instance, either you have to change every plugin to not need it,
or you need syntax to signal to lazypipe to treat this argument differently.

@eduardolundgren

This comment has been minimized.

Show comment
Hide comment
@eduardolundgren

eduardolundgren Jul 22, 2014

Following the instructions, the following example works fine:

function buildCssPipeline() {
  return lazypipe()
    .pipe(function() {
      var browsers = [
        'android >= 4.4',
        'bb >= 10',
        'chrome >= 34',
        'ff >= 30',
        'ie >= 8',
        'ie_mob >= 10',
        'ios >= 7',
        'opera >= 23',
        'safari >= 7'
      ];
      return plugins.if('*.css',
        plugins.autoprefixer(browsers)
          .pipe(plugins.csso()));
    });
}

Would be good to have it documented somewhere on gulp-if or on lazypipe project.
Feel free to close the issue. Thank you for the help.

Following the instructions, the following example works fine:

function buildCssPipeline() {
  return lazypipe()
    .pipe(function() {
      var browsers = [
        'android >= 4.4',
        'bb >= 10',
        'chrome >= 34',
        'ff >= 30',
        'ie >= 8',
        'ie_mob >= 10',
        'ios >= 7',
        'opera >= 23',
        'safari >= 7'
      ];
      return plugins.if('*.css',
        plugins.autoprefixer(browsers)
          .pipe(plugins.csso()));
    });
}

Would be good to have it documented somewhere on gulp-if or on lazypipe project.
Feel free to close the issue. Thank you for the help.

@robrich

This comment has been minimized.

Show comment
Hide comment
@robrich

robrich Jul 22, 2014

Owner

documented at https://github.com/robrich/gulp-if#works-great-inside-lazypipe and OverZealous/lazypipe#9. Thanks for your work documenting this issue.

Owner

robrich commented Jul 22, 2014

documented at https://github.com/robrich/gulp-if#works-great-inside-lazypipe and OverZealous/lazypipe#9. Thanks for your work documenting this issue.

@robrich robrich closed this Jul 22, 2014

@eduardolundgren

This comment has been minimized.

Show comment
Hide comment

👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment