gulp-optimize-images
Generates images at different sizes
Optimize images with given options
Installation
gulp-optimize-images depends on sharp.
$ npm install --save-dev gulp-optimize-imageUsage
const { dest, series, src } =require("gulp");
const optimizeImages =require("../dist/index");
const srcDir = "src";
const destDir = "dest";
const sizes = [360, 720];
// https://sharp.pixelplumbing.com/api-constructor
const sharpOptions = {
limitInputPixels: false
}
// https://sharp.pixelplumbing.com/api-output
const compressOptions = {
jpeg: {
quality: 80,
progressive: true,
},
png: {
quality: 90,
progressive: true,
compressionLevel: 6,
},
webp: {
quality: 80,
},
};
function sharpImages() {
return src(srcDir + "/**/*")
.pipe(optimizeImages({
sharpOptions,
compressOptions,
sizes
}))
.pipe(dest(destDir));
}
exports.default = series(sharpImages);API
responsive([options])
options.sharpOptions
Type: Object
Default: {} - Merged with default sharp constructor options
Sharp options available on https://sharp.pixelplumbing.com/api-constructor
options.compressOptions
Type: Object
Default: {} - Merged with default sharp image options
const compressOptions = {
jpeg?: Object;
png?: Object;
webp?: Object;
gif?: Object;
tiff?: Object;
avif?: Object;
heif?: Object;
}Object containing options for each image format.
Available formats available on https://sharp.pixelplumbing.com/api-output.
If not provided uses default sharp settings
options.sizes
Type: number[]
Default: []
Number array of width sizes. If provided, outputs images in this sizes including original size.