Disable webp conversion in webpack (images not working on iOS)

[krissrex]

The default webpack config will convert images to webp (but keep the file extension). Webp is not a bad format in itself, but without further configuration to also have png fallbacks, the images will break on iOS.

The usual flow with webp seems to be to detect the user agent or read Accept headers and only serve webp to android/PC (or possibly use <picture> with multiple sources).

(In addition, my images grew with 5kB and 10kB when they were webp...)

Diff:

--- a/webpack.config.js
+++ b/webpack.config.js
@@ -76,10 +76,6 @@ module.exports = {
               gifsicle: {
                 interlaced: true,
               },
-              // the webp option will enable WEBP
-              webp: {
-                quality: 80,
-              },
             },
           },
         ],

[ixartz]

Thank you for your feedback. I have just removed the webp option in webpack.config.js: https://github.com/ixartz/Eleventy-Starter-Boilerplate/blob/master/webpack.config.js#L78

It was a misconfiguration of the webpack config.

Yes, currently, the project does not support webp and it should be removed from the project for now.