Better usage examples

[petulla]

Hi Could you provide some better examples? It's not clear to me how you would take, say, a directory of images with similar file names and generate responsive images from a template of sizes. I am planning to test a bit, but it would be great to have better docs.

[patlux]

+1

[herrschuessler]

+1

[stevesloan]

+1

[silvenon]

What do you want to achieve exactly? Could you give an example?

[petulla]

This is the Gulp code I ended on:

gulp.task('responsify', function() {
  return gulp.src('./src/assets/images/photos/slideshow_raw/*.JPG')
    .pipe(responsive({
      '*.JPG': [
        { width:400,
        rename: {
          suffix:'-400'
        }},{
        width:800,
        rename: {
          suffix:'-800'
        }},{
        width:1500,
        rename: {
          suffix:'-1500'
        }
      },{
        width:2200,
        rename: {
          suffix:'-2200'
        }
      },{
        width:3000,
        rename: {
          suffix:'-3000'
        }
      }]
    }))
    .pipe(gulp.dest('./build/assets/images/photos/responsive/jpg/'));
});

[silvenon]

What was unclear about the usage?

[petulla]

It didn't explain the suffix syntax.

[silvenon]

The readme says:

Renaming is implemented by rename module. Options are correspond options of gulp-rename module.

So it links to the resources where you can see the rename syntax. Maybe it should be mentioned earlier, though.

[petulla]

It's buried. A concrete example is useful.

[mahnunchik]

Hi @petulla @patlux @herrschuessler @stevesloan @silvenon

Usage examples: https://github.com/mahnunchik/gulp-responsive/tree/master/examples

Feedback welcome 😉