Processs newer images only

[TxHawks]

It would be very helpful to have an option to only process files that do not exist in dest, or that are newer than those in dest.

I tried piping through gulp-newer but got the following error: Expected a source file with stats

[mahnunchik]

Hi @TxHawks

Could you please provide an example.

[silvenon]

Here's an example. gulp-newer can only do 1:1 and many:1. This is 1:many. It would be nice if gulp-responsive only processed newer images.

var responsive = require('gulp-responsive');

gulp.task('images', function() {
  return gulp.src('app/images/**/*')
    .pipe(responsive({
      'logo.png': [{
        width: 200,
        rename: {suffix: '200'}
      }, {
        width: 400,
        rename: {suffix: '400'}
      }]
    }))
    .pipe('dist/images');
});

The goal is to not process app/images/logo.png if it's not newer than dist/images/logo200.png and dist/images/logo400.png (probably enough to check only one of them). This would be a pain, if not impossible, to do with gulp-newer. Maybe I'm missing something.

[mahnunchik]

Hi @TxHawks @mvasin

gulp-cached works like a charm! It supports the necessary 1:many relations between files.

gulp-changed supports only 1:1 gulp-newer supports 1:1 and many:1

But you have to set errorOnUnusedConfig option to false because there will be unused configurations for not updated files.

My test case:

'use strict';

var gulp = require('gulp');
var $ = require('gulp-load-plugins')();
// gulp-responsive
// gulp-cached
// gulp-debug

gulp.task('default', ['images'], function() {
  gulp.watch('src/*.jpg', ['images']);
});

gulp.task('images', function() {
  return gulp.src('src/*.jpg')
    .pipe($.debug({title: 'sources:'}))
    .pipe($.cached('images'))
    .pipe($.debug({title: 'before gulp-responsive:'}))
    .pipe($.responsive({
      'image.jpg': [{
        width: 200,
        rename: 'img-200.jpg'
      }, {
        width: 400,
        rename: 'img-400.jpg'
      }, {
        width: 600,
        rename: 'img-600.jpg'
      }]
    }, {
      errorOnUnusedConfig: false
    }))
    .pipe($.debug({title: 'after gulp-responsive:'}))
    .pipe(gulp.dest('dist'));
});

[strarsis]

Thank you, I was looking for a gulp plugin that allows 1:many comparisons (gulp-cached).

[mahnunchik]

@TxHawks @silvenon Is issue resolved for you?

[TxHawks]

Yep. Thanks

[mahnunchik]

Landed version 2.0 of gulp-responsive

Feedback welcome :wink: