[Solved] Module not found: Error: Can't resolve 'react-dom/client' in ''

#react #reactdom #debug #versioning

Problem:

Running into the following error when trying to start the development server of a create-react-app via npm start:

Module not found: Error: Can't resolve 'react-dom/client' in '<local_path>'

Solution:

One potential issue that might be causing this issue could be versioning issues. The index.js file created after running npx create-react-app uses React version 18 but I had downgraded to React version 17 afterwards without making the necessary changes to the index.js file.

This issue's resolution called for having to make the following modifications to the index.js file:

import React from 'react';
// import ReactDOM from 'react-dom/client'; <- This import is only for React version 18
import { render } from 'react-dom'; // <- This is the correct import statement for React version 17
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';

// const root = ReactDOM.createRoot(document.getElementById('root'));
const root = document.getElementById('root'); // <- This is the correct method call for React version 17
render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  root
);

Making the above changes should resolve your issue if you followed the same approach I did.

Hope this helps.

Conclusion

Thanks for reading this blog post!

If you have any questions or concerns please feel free to post a comment in this post and I will get back to you when I find the time.

If you found this article helpful please share it and make sure to follow me on Twitter and GitHub, connect with me on LinkedIn and subscribe to my YouTube channel.