webpack-image-minimizer-plugin

The Webpack plugin for almost quality-lossless compression of images.

Description

A few simple lines of code can help you reduce the size of your image file by 70% without changing the quality of the image.

Install

npm install --save-dev webpack-image-minimizer-plugin

Usage

add following codes into your "webpack.config.js" file

const webpackImageMinimizerPlugin = require('webpack-image-minimizer-plugin');

module.exports = {
...
 plugins: [
  ...
  new webpackImageMinimizerPlugin()
  ]
}

Customizition

WebpackImageMinimizerPlugin Constructor accept following options:

{
  // Set if cache file in node_modules/.cache/webpack-image-compress-plugin
  // If you want use new options to compress image, you should clear that folder.
  // so if the asset is not modified, it will use the cached compressed image file.
  enableCache: true, 
  pngQuantOptions: { }, // https://github.com/imagemin/imagemin-pngquant
  mozjpegOptions: { quality: 80 }, // https://github.com/imagemin/imagemin-mozjpeg
  // see 
  // build log.
  showDetailLog: true;
}

This plugin based on image-min, imagemin-pngquant, imagemin-mozjpeg. For more customization, please refer to them.