Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Closed
krissrex opened this issue Aug 9, 2020 · 1 comment
Closed

Comments

@krissrex
Copy link

krissrex commented Aug 9, 2020

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
Copy link
Owner

ixartz commented Aug 10, 2020

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.

@ixartz ixartz closed this as completed Aug 10, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants