gulp task for(... in ...) create correctly?

Question

What am I doing wrong?

gulpfile.js

'use strict';

// Modules & Plugins
var gulp = require('gulp');
const image = require('gulp-image');
var $ = require('gulp-load-plugins')();

let directories = [
  '2006/Art1',
  '2006/Art2',
  '2010/Art1'
];

function gulpTask(directoryName) {
  gulp.task('blogmotionAllMedia', function () {
    return gulp
      .src('src/content/' + directoryName + '/media/*.{jpg,jpeg,png,gif}')
      .pipe($.responsive({
        '*.jpg': [
          { width: 400, rename: { suffix: '-4' } },
          { rename: { suffix: '-6' } }
        ],
      }))
      .pipe(image({
        jpegRecompress: true
      }))
      .pipe(gulp.dest('dist/content/' + directoryName + '/media'))
  });
}

var directory;

for (directory in directories) {
  gulpTask(directory);
}

run task npx gulp gulpTask

unexpected

I get the following error message:

Task never defined: gulpTask

I am still attached to my past question with the answer (idea) from Miles

Benjamin Eckardt · Accepted Answer · 2020-06-05T10:26:41.990

First, the gulp task should be registered with the name you want to invoke it gulp.task('blogmotionAllMedia', ... should be gulp.task('gulpTask', .... Furthermore I think you should iterate over the directories inside of the task.

Additionally I think you need to merge the resulting streams using merge-stream by const merge = require('merge-stream') and return merge(directories.map(singleDirectoryGulpTask));

Result should look like this: (Disclaimer: haven't done gulp stuff for years. Still hope it helps)

'use strict';

// Modules & Plugins
var gulp = require('gulp');
const image = require('gulp-image');
var $ = require('gulp-load-plugins')();
const merge = require('merge-stream')

let directories = [
    '2006/Art1',
    '2006/Art2',
    '2010/Art1'
];

gulp.task('gulpTask', function () {
    function singleDirectoryGulpTask(directoryName) {
        return gulp
            .src('src/content/' + directoryName + '/media/*.{jpg,jpeg,png,gif}')
            .pipe($.responsive({
                '*.jpg': [
                    { width: 400, rename: { suffix: '-4' } },
                    { rename: { suffix: '-6' } }
                ],
            }))
            .pipe(image({
                jpegRecompress: true
            }))
            .pipe(gulp.dest('dist/content/' + directoryName + '/media'));
    }

    return merge(directories.map(singleDirectoryGulpTask));
});

thanks, i did try it and got this message: The following tasks did not complete: gulpTask Did you forget to signal async completion? what that means? — Cem Firat, Jun 05 '20 at 09:34
According to this https://stackoverflow.com/questions/26784094/can-i-use-a-gulp-task-with-multiple-sources-and-multiple-destinations you need to use `merge-stream` to collect the resulting streams of multiple gulp calls. — Benjamin Eckardt, Jun 05 '20 at 10:27
danke für Deine Hilfe! Liebe Grüße aus Wien! {thank you for your help! Greetings from Vienna!} — Cem Firat, Jun 05 '20 at 11:05

score 0 · Answer 2 · answered Jun 05 '20 at 09:35

0

Change:

for (directory in directories) {
  gulpTask(directory);
}

to:

for (directory of directories) {
  gulpTask(directory);
}

answered Jun 05 '20 at 09:35

Priyank-py

349
3
14

Unfortunately does not work. takes only the first pictures from the first directory – Cem Firat Jun 05 '20 at 09:53

gulp task for(... in ...) create correctly?

2 Answers2