How to fix recent warning “ReactDOM.render is no longer supported in React 18”.

Photo by David Pupaza on Unsplash

Recently, many of you might have been getting following error in browser console when you run the react app.

Warning message on browser console:

“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”

Don’t worry about the error; we’ll address it as quickly in the simplest way possible not stressing too much on the explanation.
When react js issues the warning ReactDOM.render is no longer supported in React 18.

Your current ./src/index.js might look something shown as below.

To resolve the ReactDOM-related issue React 18 does not support render any longer.

Simply change the index.js file to look like the one below.

Now try running the react app again.

References:

1. Replacing render with createRoot [Link]