Optimize images only when required

[arso1er]

Hi,

I just installed this package to optimize images on a page of my project. I used require('path/to/image?webp');. I expected images to be optimized only when I use the require statement and not when I reference the path directly, but all my images are being optimized. Is there a way to solve this ?

Thanks.

[arso1er]

After some search, it turns out it's a webpack thing. Webpack will process all images in the folder when dynamic require is used with a variable.
@cyrilwanner Can you confirm there's no way to bypass this?

[cyrilwanner]

This is indeed a webpack limitation. The only way would be to move all images you want to optimize into a separate folder and use that folder as a prefix in your require statement (require('./images/webp/${img}')). Webpack will then only optimize the ones in ./images/webp/.

[arso1er]

OK. Guess I'll roll my own solution server side with sharp.

Thanks.