batch images (resize and compress)

gulpfile.js

// install

// cd node_modules \
// chmod -R a+rwX .

// run without sudo
// npm i gulp-responsive --unsafe-perm

// npm i del gulp psd2png color
// npm i gulp-imagemin imagemin-pngquant imagemin-zopfli imagemin-mozjpeg imagemin-giflossy -f
// node node_modules/jpegtran-bin/lib/install.js
// node node_modules/gifsicle/lib/install.js
// node node_modules/zopflipng-bin/lib/install.js
// node node_modules/mozjpeg/lib/install.js
// node node_modules/giflossy/lib/install.js
// node node_modules/pngquant-bin/lib/install.js


var gulp = require('gulp');
var imagemin = require('gulp-imagemin');
var imageminPngquant = require('imagemin-pngquant');
var imageminZopfli = require('imagemin-zopfli');
var imageminMozjpeg = require('imagemin-mozjpeg'); //need to run 'brew install libpng'
var imageminGiflossy = require('imagemin-giflossy');
var del = require('del');
var responsive = require('gulp-responsive');
var psd2png = require('gulp-psd2png');
// processing directories
var dirorig = './app/orig/';
var dirtumb = './app/compress/';
var dirpsd = './app/psd/';

// Global configuration for all images
var resimgconfig = {
    // Use progressive (interlace) scan for JPEG and PNG output
    progressive: true,
    // Strip all metadata
    withMetadata: false,
    errorOnEnlargement: false,
    withoutEnlargement: true, // copy original file with/without renaming
    skipOnEnlargement: false
};

// create thumbnails for portfolio
gulp.task('resize', ['psd'], function() {
    // size of portfolio tumb
    var tumbport = 1200;
    // remove tumb sub folders
    del.sync(dirtumb);
    // create tumbs
    return gulp.src(dirorig + '**/*.*')
        .pipe(responsive({
            '**': [{
                // convert png to jpg
                flatten: true, // add backgoround #fff
                rename: {
                    extname: '.jpg' // rename ext and converting (converting format get from extname)
                },
                // end converting
                width: tumbport,
                height: tumbport,
                quality: 90,
                //min: true, // min size will be tumbport ()
                max: true // max size will be tumbport
            }],
        }, resimgconfig))
        .pipe(gulp.dest(dirtumb));
});

//compress all images
gulp.task('compress', ['resize'], function() {
    return gulp.src(dirtumb + '**/*.*')
        .pipe(imagemin([
            //png
            imageminPngquant({
                speed: 1,
                quality: [0.95, 1] //lossy settings
            }),
            imageminZopfli({
                more: true
            }),
            //gif
            // imagemin.gifsicle({
            //     interlaced: true,
            //     optimizationLevel: 3
            // }),
            //gif very light lossy, use only one of gifsicle or Giflossy
            imageminGiflossy({
                optimizationLevel: 3,
                optimize: 3, //keep-empty: Preserve empty transparent frames
                lossy: 2
            }),
            //svg
            imagemin.svgo({
                plugins: [{
                    removeViewBox: false
                }]
            }),
            //jpg lossless
            imagemin.jpegtran({
                progressive: true
            }),
            //jpg very light lossy, use vs jpegtran
            imageminMozjpeg({
                quality: 90
            })
        ]))
        .pipe(gulp.dest(dirtumb));
});

gulp.task('default', ['compress']);

gulp.task('psd', function() {
  return gulp.src(dirpsd + '**/*.*')
    .pipe(psd2png())
    .pipe(gulp.dest(dirorig));
});