How to fix ReactDOM.render is no longer supported in React 18

You may have noticed the following warning in the browser console if you just upgraded your react version to 18 or created an app using create-react-app:

Warning

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.
Error - ReactDOM.render is no longer supported in React 18 - Clue Mediator
Error Warning – ReactDOM.render is no longer supported in React 18 – Clue Mediator

We’ll look at why this warning emerges and how to remedy it in this post.

Version 18 of React is recently published. It has added the createRoot API in the current version, which is used to support new React capabilities.

The createRoot API will take the place of the previous version’s ReactDOM.render. As a result, we’ve received a warning.

From:

To:

The new code will be as follows:

index.js

Your problem should now be fixed, as your error should be gone.

That’s it for today.
Thank you for reading. Happy Coding..!! 🙂

If you found value in this article,
you can support us by buying me a coffee! ☕

You may also like...

Leave a Reply

Your email address will not be published. Required fields are marked *