CODEWITHSUNDEEP
gulp
JonnySerra
JonnySerra

Reputation: 1074

Gulp dest.on is not a function

I'm getting that annoying dest.on error on my gulp task for optimizing images using gulp-imagemin. I have a somewhat uncommon set up going here, using gulp-load-plugins in order to have all my tasks separate from the actual gulpfile.

On the task in question I'm requiring:

"gulp-imagemin": "^3.0.1",
"gulp-util": "^3.0.7",

And the idea is to log a message when the images are done for each of the streams, gulp.dest() doesn't seem to like something about my gutil.log() method:

module.exports = function(gulp, plugins, config) {

  return function()
  {
    var stream =
        // Optimize Images for Version A //
        gulp.src(config.assetsDir + '/a/images/*')
            .pipe(plugins.util.log('Hello'))
            .pipe(plugins.imagemin({
                progressive: true,
                optimizationLevel: 7,
                svgoPlugins: [{removeViewBox: false}],
                use: [plugins.pngquant()]
            }))
            .pipe(gulp.dest(config.publicDir + 'images/a/'))

        // Optimize Images for Version B //
        gulp.src(config.assetsDir + '/b/images/*')
            .pipe(plugins.imagemin({
                progressive: true,
                optimizationLevel: 7,
                svgoPlugins: [{removeViewBox: false}],
                use: [plugins.pngquant()]
            }))
            .pipe(gulp.dest(config.publicDir + 'images/b/'))
            .pipe(plugins.util.log("Task Done!"))
  }
};

The problem appears to be on the final line there, I'm sending in the dependency for gutil through my plugins object and then referencing it and calling it's log() method. It works fine without the log, what am I missing here?

Upvotes: 3

Views: 2566

Answers (1)

Sven Schoenung
Sven Schoenung

Reputation: 30574

Things like gulp.dest() and plugins like imagemin() return stream.Transform objects. Only those you can pass to .pipe().

gutil.log() on other hand doesn't return a stream.Transform and therefore can't be passed to .pipe().

If you still want to use it from within a stream you will have to listen for one of the events that are exposed by node.js streams, for example the 'data' event (called for each file):

gulp.src(config.assetsDir + '/a/images/*')
  .on('data', function() { plugins.util.log('Hello'); })

Or the 'end' event (called when a stream is done):

  .pipe(gulp.dest(config.publicDir + 'images/b/'))
  .on('end', function() { plugins.util.log("Task Done!") });

Upvotes: 3

Related Questions