Next js, ReactDom.render is no longer supported

Question

I just spun up a new Next JS app with Next 12.

I am getting this error on all page loads in the browser:

Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it's running React 17. Learn more: https://reactjs.org/link/switch-to-createroot

Next js's ReactDom.render is under the hood, how can I resolve this error?

Answer 1

For me it was indeed Chakra. You need to Install the latest Chakra ui for NextJS

npm i @chakra-ui/[email protected]

Answer 2

You may also get this warning if you've updated to React 18 and are using a custom server setup in your Next.js app.

For this case, the issue has been addressed in this PR in version 12.1.7-canary.2. To fix it in your project simply update Next.js to version >=12.2.0.

npm install next@latest