node package manager
Stop wasting time. Easily manage code sharing in your team. Create a free org »

grunt-image

grunt-image

Optimize PNG, JPEG, GIF, SVG images with grunt task.

Build Status NPM version Dependency Status devDependency Status

Install

$ npm install --save-dev grunt-image

Usage

This is an example of gruntfile.js.

module.exports = function (grunt) {
  grunt.initConfig({
    image: {
      static: {
        options: {
          optipng: false,
          pngquant: true,
          zopflipng: true,
          jpegRecompress: false,
          mozjpeg: true,
          guetzli: false,
          gifsicle: true,
          svgo: true
        },
        files: {
          'dist/img.png': 'src/img.png',
          'dist/img.jpg': 'src/img.jpg',
          'dist/img.gif': 'src/img.gif',
          'dist/img.svg': 'src/img.svg'
        }
      },
      dynamic: {
        files: [{
          expand: true,
          cwd: 'src/',
          src: ['**/*.{png,jpg,gif,svg}'],
          dest: 'dist/'
        }]
      }
    }
  });
 
  grunt.loadNpmTasks('grunt-image');
};

You can configure parameters applied to each optimizers such as following:

options: {
  optipng: ['-i 1', '-strip all', '-fix', '-o7', '-force'],
  pngquant: ['--speed=1', '--force', 256],
  zopflipng: ['-y', '--lossy_8bit', '--lossy_transparent'],
  jpegRecompress: ['--strip', '--quality', 'medium', '--min', 40, '--max', 80],
  mozjpeg: ['-optimize', '-progressive'],
  guetzli: ['--quality', 85],
  gifsicle: ['--optimize'],
  svgo: ['--enable', 'cleanupIDs', '--disable', 'convertColors']
}

Result

grunt-image result

License

MIT © Shogo Sensui