Plugin doesn't work with webpack 5 / Next.js 11

Thanks a lot for this excellent plugin, it’s been really helpful for us!

Problem

This plugin doesn’t work correctly when using Next.js 11. Attempts to require images result in an error like the one below during the build:

Failed to compile.

./src/images/my-awesome-image.svg
TypeError: unsupported file type: undefined (file: undefined)

Workaround

It seems like the problem is due to the fact that from version 11 Next.js uses Webpack 5 by default. It looks like it’s possible to work around this issue by forcing the use of Webpack 4. This is done by setting webpack5 to false in next.config.js - see the webpack5 option docs for more.

Edit: rather than disabling webpack5, this can be solved more neatly by toggling disableStaticImages in the nextjs config. See @jaimemasson’s comment below.

[mystrdat]

If next11 does static image optimization itself, what is the benefit of using this package now?

As of now, the next/image component is garbage.

[jaimemasson]

the actual fix for this is to disableStaticImages in nextjs config. see https://nextjs.org/docs/basic-features/image-optimization#disable-static-imports