Source:  Twitter logo

I've seen few posts related to this type of error. But couldn't resolve in mine.

My package.json:

"react": "~0.14.7",
"webpack": "^1.12.13",
"react-hot-loader": "^3.0.0-beta.6",
.
.

I'm getting following error on webpack:

ERROR in ./public/src/main.js
Module not found: Error: Cannot resolve module 'react-dom' in C:\Users\react-example\public\src 
@ ./public/src/main.js 19:16-36

But in the cmd line when I did

npm -v react-dom

I get 3.10.10. react-dom is there. But I wonder why it still gives this error.

When I installed react-dom through npm "npm install react-dom", and run webpack I get following errors:

ERROR in ./~/react-dom/lib/ReactDOMNullInputValuePropHook.js
Module not found: Error: Cannot resolve 'file' or 'directory' C:\Users\react-example/node_modules/react/lib/ReactComponentTreeHook in C:\Users\react-example\node_modules\react-dom\lib
 @ ./~/react-dom/lib/ReactDOMNullInputValuePropHook.js 13:29-72

ERROR in ./~/react-dom/lib/ReactDOMUnknownPropertyHook.js
Module not found: Error: Cannot resolve 'file' or 'directory' C:\Users\react-example/node_modules/react/lib/ReactComponentTreeHook in C:\Users\react-example\node_modules\react-dom\lib
 @ ./~/react-dom/lib/ReactDOMUnknownPropertyHook.js 15:29-72

ERROR in ./~/react-dom/lib/ReactDOMInvalidARIAHook.js
Module not found: Error: Cannot resolve 'file' or 'directory' C:\Users\react-example/node_modules/react/lib/ReactComponentTreeHook in C:\Users\react-example\node_modules\react-dom\lib
 @ ./~/react-dom/lib/ReactDOMInvalidARIAHook.js 14:29-72

ERROR in ./~/react-dom/lib/ReactDebugTool.js
Module not found: Error: Cannot resolve 'file' or 'directory' C:\Users\react-example/node_modules/react/lib/ReactComponentTreeHook in C:\Users\react-example\node_modules\react-dom\lib
 @ ./~/react-dom/lib/ReactDebugTool.js 16:29-72

Please help.

Issue is react-dom is not installed, when you hit npm -v react-dom, it gives you the version of npm not react-dom version, you can check that by using npm -v or npm -v react-dom both will give you the same result. You are checking the package version incorrectly.

How to install react and react-dom properly?

Use this to install react and react-dom:

npm install react react-dom --save

After that, you can check your package.json file, if react and react-dom has been installed correctly, you will find an entry for that.

How to check install package version?

To check all the locally installed packages version:

npm list    

For globally installed packages, use -g also:

npm list -g

To check the version of any specific package, specify the package name also:

npm list PackageName

For Example =>
   npm list react
   npm list react-router

After installation your package.json will look like this:

{
  "name": "***",
  "version": "1.0.0",
  "main": "***",
  "scripts": {
     ....
  },
  "repository": {
     ....
  },
  "keywords": [],
  "author": "",
  "dependencies": {
    ....
    "react": "^15.4.2",          //react
    "react-dom": "^15.4.2",      //react-dom
     ....
  },
  "devDependencies": {
     ....
  }
}

Latest version of react-dom is : 15.4.2

Reference: https://www.npmjs.com/package/react-dom

50 users liked answer #0dislike answer #050
Mayank Shukla profile pic
Mayank Shukla

In my case I had an alias in my webpack.config.common.js:

 resolve: {
    extensions: ['.js', '.jsx'],
    alias: {
      'react-dom': '@hot-loader/react-dom',
    },
  },

I just removed this line:

'react-dom': '@hot-loader/react-dom',

and it was fixed.

21 users liked answer #1dislike answer #121
Milena profile pic
Milena

I used 'npm update' and that solved my problem.

4 users liked answer #2dislike answer #24
Djesu profile pic
Djesu

In my case, it was an alias I had in my webpack.conf, which was looking for @hot-loader/react-dom.

4 users liked answer #3dislike answer #34
ATOzTOA profile pic
ATOzTOA

For anybody reading this that wasn't able to figure it out. I had the same issue which I ended up resolving by installing the "react-router" package which is simply running the following command

npm i react-router-dom --save for a browser app.

npm i react-router-native for a native app.

3 users liked answer #4dislike answer #43
Kankuro profile pic
Kankuro

You may need to update react and react-dom. Despite react-dom actually being installed, I was having this issue on ^15.5.4 and it went away with ^16.8.6:

$ # update the react and react-dom modules
$ yarn add react react-dom

Ensure that the two version match exactly in package.json:

"react": "^16.8.6",
"react-dom": "^16.8.6",

Delete yarn.lock, node_modules, and yarn again.

rm -Rf yarn.lock node_modules && yarn
1 users liked answer #5dislike answer #51
Kevin Reilly profile pic
Kevin Reilly

Try rm -rf node_modules && yarn or rm -rf node_modules && npm install if you use npm instead of yarn.

0 users liked answer #6dislike answer #60
Ayesha O. profile pic
Ayesha O.

My particular issue for getting this error:

ERROR in ./src/index.js Module not found: Error: Can't resolve 'eact-dom' in 'C:\Users\Jose\Desktop\woz-u-React\React-Course\react-lesson-one\src' @ ./src/index.js 2:0-32 @ multi (webpack)-dev-server/client?http://localhost:8080 ./src/index.js

To fix this issue, I had to unzip the folder before installing.

0 users liked answer #7dislike answer #70
Jose Salazar profile pic
Jose Salazar

The following command will resolve the problem.

npm install react react-dom --save

0 users liked answer #8dislike answer #80
Farzana Khan profile pic
Farzana Khan

For those using Parcel, this can occur if you are targeting Node for a browser-based app.

There are 3 ways Parcel will infer this from your package.json:

Remove node as the target, or specify the --target as browser at the command line.

Also see:

0 users liked answer #9dislike answer #90
James Gentes profile pic
James Gentes

Your app is pointing to the global version of react hence you need install it manually using global keyword. You can also compare your installed version of react-dom in package.json of your current project and globally installed react-dom version using command npm -v react-dom if both are different then manually install react dom using command:

sudo npm install -g react-dom@17.0.2
-1 users liked answer #10dislike answer #10-1
Aniket profile pic
Aniket

Copyright © 2022 QueryThreads

All content on Query Threads is licensed under the Creative Commons Attribution-ShareAlike 3.0 license (CC BY-SA 3.0).