A loader for webpack4 which minify images.
To begin, you'll need to install imgmin-loader
:
$ npm install imgmin-loader imagemin-pngquant imagemin-mozjpeg --save-dev
webpack.config.js
module.exports = {
module: {
rules: [
{
test: /\.(png|jpg|gif)$/i,
use: [
{
loader: 'url-loader',
options: {
limit: 8192
}
},
{
loader: 'imgmin-loader',
options: {
limit: 8192,
plugins: [
require('imagemin-pngquant')(),
require('imagemin-mozjpeg')()
]
}
}
]
}
]
}
}
And run webpack
via your preferred method.
Type: Number|Boolean|String
Default: undefined
The limit can be specified via loader options and defaults to no limit.
A Number
specifying the maximum size of an image in bytes. If the image size is
equal or greater than the limit, will disable minify.
webpack.config.js
module.exports = {
module: {
rules: [
{
test: /\.(png|jpg|gif)$/i,
use: [
{
loader: 'imgmin-loader',
options: {
limit: 8192,
plugins: [
require('imagemin-pngquant')(),
require('imagemin-mozjpeg')()
]
}
}
]
}
]
}
}
Enable or disable minify images.
webpack.config.js
module.exports = {
module: {
rules: [
{
test: /\.(png|jpg|gif)$/i,
use: [
{
loader: 'imgmin-loader',
options: {
limit: false,
plugins: [
require('imagemin-pngquant')(),
require('imagemin-mozjpeg')()
]
}
}
]
}
]
}
}