无法解析模块 'react-dom'

Question

我很少看到与此类错误相关的帖子。但是在我的无法解决。

我的package.json:

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

我在 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

但是在我执行

时在 cmd 行中

npm -v react-dom

我得到 3.10.10。 react-dom 在那里。但是我想知道为什么它仍然报这个错误。

当我通过 npm "npm install react-dom" 安装 react-dom 和运行 webpack 时，出现以下错误：

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

请帮忙

Answer 1

问题是 react-dom 没有安装，当你点击 npm -v react-dom 时，它给你的是 npm 的版本而不是 react-dom 的版本，你可以使用npm -v 或 npm -v react-dom 两者都会给您相同的结果。您检查包版本不正确。

How to install react and react-dom properly?

用这个安装react和react-dom:

npm install react react-dom --save

之后，你可以检查你的 package.json 文件，如果 react 和 react-dom 已经正确安装，你会找到一个条目。

How to check install package version?

检查所有本地安装的包版本：

npm list

对于全局安装的包，也使用 -g:

npm list -g

要检查任何特定包的版本，还要指定包名称：

npm list PackageName

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

安装后您的 package.json 将如下所示：

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

react-dom 的最新版本是：15.4.2

参考：https://www.npmjs.com/package/react-dom

Answer 2

对于任何阅读本文但无法理解的人。我遇到了同样的问题，我最终通过安装 "react-router" package 解决了这个问题，它只是运行以下命令

npm i react-router-dom --save 对于浏览器应用。

npm i react-router-native 对于本机应用程序。

Answer 3

我使用了 'npm update'，这解决了我的问题。

Answer 4

如果您使用 npm 而不是纱线，请尝试 rm -rf node_modules && yarn 或 rm -rf node_modules && npm install。

Answer 5

我收到此错误的具体问题：

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

要解决此问题，我必须在安装前解压缩文件夹。

Answer 6

您可能需要更新 react 和 react-dom。尽管实际上安装了 react-dom，但我在 ^15.5.4 上遇到了这个问题，它随着 ^16.8.6:

消失了

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

确保两个版本在package.json中完全匹配:

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

再次删除 yarn.lock、node_modules 和 yarn。

rm -Rf yarn.lock node_modules && yarn

Answer 7

就我而言，这是我在 webpack.conf 中使用的别名，它正在寻找 @hot-loader/react-dom。

Answer 8

就我而言，我的 webpack.config.common.js:

中有一个别名

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

我刚刚删除了这一行：

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

它已修复。

Answer 9

以下命令将解决问题。

npm install react react-dom --save

Answer 10

对于使用 Parcel 的用户，如果您针对 Node 基于浏览器的应用程序，则可能会发生这种情况。

Parcel 会通过 3 种方式从您的 package.json 中推断出这一点：

删除节点作为目标，或在命令行中将 --target 指定为 browser。

另见：

Answer 11

您的应用指向 React 的全球版本，因此您需要使用 global 关键字手动安装它。您还可以使用命令 npm -v react-dom 比较当前项目 package.json 中安装的 react-dom 版本和全局安装的 react-dom 版本，如果两者不同，则手动安装反应 dom 使用命令：

sudo npm install -g react-dom@17.0.2

无法解析模块 'react-dom'

Cannot resolve module 'react-dom'

reactjs

webpack

react-dom

react-hot-loader