How to disable some output formats?
biosocket opened this issue · comments
Thanks for this awesome project :)
How do you disable some output formats? When I run the examples, each image is converted into every output format. How do you, for example, only output JPG? Or similarly, output each image only in its original format. For example, if a JPG and and PNG are processed, the output is a JPG and a PNG, corresponding to the input.
Thanks
Thanks for the question @biosocket, I'm glad that this project is useful for you :)
I tried to make this plugin as thin a layer as possible between gulp and libSquoosh, configuration object is completely the same and is passed as is.
Just like in libSquoosh, you can transform a single file into several formats at once:
gulpSquoosh({
encodeOptions: {
jxl: {},
avif: {},
},
});
The result of this configuration will be 2 files (for each input file) .avif
and .jxl
.
Most codecs in libSquoosh change the image format (webp
, avif
, jxl
, wp2
), but there are mozjpeg
and oxipng
that retain the original format.
If we have .png
and .jpg
source images and all you need to do is reduce their size, you can use dynamic configuration:
gulpSquoosh(({ filePath }) => {
const imageExtension = path.extname(filePath);
const isPng = imageExtension === ".png";
const optionsForPng = { oxipng: {} };
const optionsForJpg = { mozjpeg: {} };
const options = isPng ? optionsForPng : optionsForJpg;
return {
encodeOptions: options,
};
});
Here we pass function that will be called for each input image, and we check whether it png
or jpg
to select the appropriate codec (mozjpeg
for jpg
and oxipng
for png
).
Thus, we can have a different configuration for each image.
If you run plugin without any configuration gulpSquoosh()
, the following configuration will be taken: { mozjpeg: {}, webp: {}, avif: {}, jxl: {}, oxipng: {} }
.
Thank you so much for the detailed reply.
I will give this a try.
Your example worked perfectly.
Thanks again!