Minified React error #418 means the HTML the server rendered did not match what the client rendered on its first pass. On my Next.js site the cause was a useMediaQuery hook that read window.matchMedia(query).matches inside a useState initializer. The server returned false , a desktop browser returned true , and React threw away the server HTML. Rewriting the hook on useSyncExternalStore with a getServerSnapshot of false made the first client render match the server by construction.

What does minified React error #418 mean?

React 19 reports it as "Hydration failed because the server rendered HTML didn't match the client." During hydration React walks the server HTML and the first client render side by side. If one has a node the other lacks, React cannot reuse the markup. It discards the server tree and renders the whole app again on the client.

In production the message is minified, so all you get is #418 and a link. It names no component and no node.…