Configure tasks

[yrezgui]

Hi guys,
I just switched from Grunt and I find with gulp, that there is no way to configure tasks. I know gulp hasn't the same philosophy as Grunt but I have some cases where I need to run tasks but with different configurations while I don't want to copy paste code too.

Can you help me ?

[dashed]

May be related to robrich/orchestrator#17

What exactly are you trying to do?

[yrezgui]

For example, I want this task to have parameters for the different folders used.

gulp.task('scripts', config, function() {
  // Minify and copy all JavaScript (except vendor scripts)
  return gulp.src(config.patternFiles)
    .pipe(uglify())
    .pipe(gulp.dest(config.destinationPath));
});

gulp.task('dev', function () {

  gulp.run('scripts', {
    patternFiles: ['dev/desktop/js/**/*.js', '!dev/desktop/js/vendor/**'],
    destinationPath: 'build/desktop/js'
  });

  gulp.run('scripts', {
    patternFiles: ['dev/mobile/js/**/*.js', '!dev/mobile/js/vendor/**'],
    destinationPath: 'build/mobile/js'
  });
});

What do you think about it (just idea of the possible code, doesn't work obviously) ?

[dashed]

My usual work around for this kind of thing is that, since it's javascript, you can wrap a function:

var do_stuff = function(config) {
  return gulp.src(config.patternFiles)
    .pipe(uglify())
    .pipe(gulp.dest(config.destinationPath));
}

gulp.task('dev', function () {

do_stuff({
    patternFiles: ['dev/desktop/js/**/*.js', '!dev/desktop/js/vendor/**'],
    destinationPath: 'build/desktop/js'
  });

do_stuff({
    patternFiles: ['dev/mobile/js/**/*.js', '!dev/mobile/js/vendor/**'],
    destinationPath: 'build/mobile/js'
  });
});

[stryju]

also, you can export some settings to json files and just require them, like

---

config.json

{
  "desktop" : {
    "src" : [ "dev/desktop/js/**/*.js", "!dev/desktop/js/vendor/**"],
    "dest" : "build/desktop/js"
  },
  "mobile" : {
    "src" : [ "dev/mobile/js/**/*.js", "!dev/mobile/js/vendor/**"],
    "dest" : "build/mobile/js"
  }
}

---

gulpfile.js

// ...
var config = require('./path/to/config.json');

function doStuff(cfg) {
  return gulp.src(cfg.src)
    .pipe(uglify())
    .pipe(gulp.dest(cfg.dest));
}

gulp.task('dev', function () {
  doStuff(config.desktop);
  doStuff(config.mobile);
});

[dashed]

@stryju nice! i hadn't thought of that one.

[stryju]

@dashed thanks!
what's more - now you can use the same config in both - grunt AND gulp ;-)

---

@yrezgui does this answer your question?

[dashed]

@travm Consider #120 (comment) to include to the frontend book?

[stryju]

@dashed @travm oh cool!

i did a thing! look 'ma! i'm helping! i'm helping! 😊

[dashed]

lol.

@stryju book in question is https://github.com/tooling/book-of-modern-frontend-tooling

[stryju]

had a quick look and it looks like some1 tackled that topic already (in grunt section, so still a valid suggestion to use it in gulp as well) ;-) tooling/book-of-modern-frontend-tooling#2 (comment)

[yrezgui]

Thanks guys. I thank about a similar way. I just wanted to know if gulp maybe think about an integration directly in the tasks. Let's use that for now 😃

[yrezgui]

I close the issue. Maybe adding @stryju idea to a best practises wiki page ?

[stryju]

PR ready ;-)

[travm]

@dashed @stryju Nice! It would be a great addition!

[dashed]

@travm note compatibility with grunt.