README
snowpack-plugin-sharp
Use sharp to optimize your images in Snowpack. This plugin will only transform images in
production
.
$ npm i -D snowpack-plugin-sharp sharp
Installation
const sharp = require("sharp");
// snowpack.config.js
module.exports = {
plugins: [
[
"snowpack-plugin-sharp",
{
transformers: [
{
fileExt: ".jpg",
apply: (file) =>
sharp(file).jpeg({
quality: 50,
chromaSubsampling: "4:4:4",
}),
},
],
},
],
],
};
Optionally, it is possible to create a second Image with 'preview-' prefix in the filename. This can be useful for generating low quality images for instance.
{
fileExt: ".webp",
withPreview: (file) => sharp(file).webp({ quality: 1 }),
apply: (file) =>
sharp(file).webp({
quality: 60,
}),
}
Further Optimization
While this plugin is useful in the build step, handling the image correctly on the Web is the other side of the coin. This library progressive-picture could be helpful in this case.