Enabling WebP doesn't seem to generate images

[adamgravita]

Hi all, thanks for an amazing loader. I've just started to use it and noticed that even when enabling WebP - my outputted images do not contain .webp files. They're just the PNG's....

Given the document description I thought this would generate my images and also my images compressed and outputted as webp.

And optional optimizers:

webp — Compress JPG & PNG images into WEBP

Here is a sample of my loader array

        {
            test: /\.jsx?$/,
            loaders: ['babel-loader'],
            include: path.join(__dirname, 'src')
        },
        {
            test: /\.(gif|png|jpe?g|svg)$/i,
            use: [
                    {
                        loader: 'url-loader',
                        options: {
                            limit: 100,
                            name: 'images/[name].[hash].[ext]'
                        }
                    },
                   
                    {
                        loader: 'image-webpack-loader',
                        options: {
                                mozjpeg: {
                                    progressive: true,
                                    quality: 65,
                                },
                                // optipng.enabled: false will disable optipng
                                optipng: {
                                    enabled: false
                                },
                                pngquant: {
                                    quality: '65-90',
                                    speed: 4,
                                },
                                gifsicle: {
                                    interlaced: false,
                                },
                                // the webp option will enable WEBP
                                webp: {
                                    quality: 80,
                                    enabled: true
                                }
                            }
                    }

                
                ],
            },

[glemiere]

I think this loader doesn't work with url-loader yet.

[chjiyun]

@glemiere I have a same problem with you, Have you worked out?

[glemiere]

Yeah I fixed it, I don't remember exactly how, you can still check my config on the related project
https://github.com/glemiere/nextjs-starter-pwa/blob/master/next.config.js
PS : Note that webp is currently only supported by chrome.

[infctr]

That doesn't clarify much. webp images are not generated with both default config from readme and with all optimizers.enabled set to false 😕

[thmsnhl]

Has anyone successfully generated webp images yet? I just followed the documentation and still, the output directory does not contain a single .webp 🙁

[manafire]

I had a similar config, but with file-loader. The JPG|PNG files are actually being converted to webp - but preserving their original filename extension. They aren't renamed with (.webp) like I also expected.

In my case, I wanted to have optimized JPG files for older browsers AND their modern webp equivalents. I couldn't get this working with loaders so I dropped the webp option from image-webpack-loader altogether and added ImageminWebpWebpackPlugin to plugins to process it after.

https://github.com/iampava/imagemin-webp-webpack-plugin