Spent the whole morning getting this to work. First next dev wasn't working and then next build && next export - the solution was scattered across a number of comments on this repo - thought I'd summarise here. I think the documentation needs updating.
Need to use version 9 for imagemin-svgo:
"imagemin-svgo": "^9.0.0",
For building and dev, need to add custom loader and disable static images in next.config.js.
Here is my next.config.js that seems to be working:
Error: Image Optimization using Next.js' default loader is not compatible with `next export`.
Possible solutions:
- Use `next start` to run a server, which includes the Image Optimization API.
- Use any provider which supports Image Optimization (like Vercel).
- Configure a third-party loader in `next.config.js`.
- Use the `loader` prop for `next/image`.
Read more: https://nextjs.org/docs/messages/export-image-api
Error for version 10 of imagemin-svgo
Error [ERR_REQUIRE_ESM]: require() of ES Module /Users/.../node_modules/imagemin-svgo/index.js from /Users/.../node_modules/next-optimized-images/lib/loaders/img-loader.js not supported.
Error for next dev somewhere along the line
error - ./public/image/favicon.png
Module parse failed: Unexpected character '�' (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
Hi there 👋
Spent the whole morning getting this to work. First
next dev
wasn't working and thennext build && next export
- the solution was scattered across a number of comments on this repo - thought I'd summarise here. I think the documentation needs updating.Need to use version 9 for imagemin-svgo:
For building and dev, need to add custom loader and disable static images in next.config.js.
Here is my next.config.js that seems to be working:
Error for next build && next export
Error for version 10 of imagemin-svgo
Error for next dev somewhere along the line