What is the purpose of @next/react-dev-overlay?

Solution 1:

The @next/react-dev-overlay package is a development-only overlay for React apps. It's used internally by Next.js to display the error messages you see in development.

This is what the error overlay looks like when a client-side error occurs in a Next.js app:

error overlay from @next/react-dev-overlay


As to why that package was included in next.config.js, I can only guess that it's being used directly in that app, and needs to be transpiled to be used. Most of the times you wouldn't need to install it or use it directly.