无法解决模块'react-dom'

时间:2017-03-03 09:05:59

标签: reactjs webpack react-dom react-hot-loader

我见过很少与此类错误相关的帖子。但是我的解决不了。

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

请帮忙。

11 个答案:

答案 0 :(得分:28)

问题是react-dom未安装,当您点击npm -v react-dom时,它会为您提供npm而不是react-dom版本的版本,您可以使用{{{ 1}}或npm -v两者都会给你相同的结果。 您正在检查软件包版本。

  

如何正确安装反应和反应?

使用它来安装react和react-dom:

npm -v react-dom

之后,您可以检查npm install react react-dom --save 文件,如果已正确安装react和react-dom,您将找到相应的条目。

  

如何检查安装包版本?

检查所有本地安装的软件包版本:

package.json

对于全局安装的软件包,请使用-g:

npm list    

要检查任何特定包的版本,请同时指定包名称:

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": { .... } } 的最新版本是:15.4.2

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

答案 1 :(得分:3)

在我的情况下,我的webpack.config.common.js中有一个别名:

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

我刚刚删除了这一行:

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

,它是固定的。

答案 2 :(得分:2)

任何阅读此内容的人都无法弄明白。我遇到了同样的问题,我最后通过安装"react-router" package来解决问题,这只是运行以下命令

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

npm i react-router-native用于原生应用。

答案 3 :(得分:1)

我使用'npm update'来解决我的问题。

答案 4 :(得分:0)

如果使用npm代替yarn,请尝试rm -rf node_modules && yarnrm -rf node_modules && npm install

答案 5 :(得分:0)

我遇到此错误的特殊问题:

  ./src/index.js中的

ERROR找不到模块:错误:无法解析   “ edom-dom”在   'C:\ Users \ Jose \ Desktop \ woz-u-React \ React-Course \ react-oneonone \ src'   @ ./src/index.js 2:0-32 @多   (webpack)-dev-server / client?http://localhost:8080 ./src/index.js

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

答案 6 :(得分:0)

您可能需要更新reactreact-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.locknode_modulesyarn

rm -Rf yarn.lock node_modules && yarn

答案 7 :(得分:0)

在我的情况下,这是我在webpack.conf中拥有的别名,该别名正在寻找@hot-loader/react-dom

答案 8 :(得分:0)

以下命令将解决问题。

npm install react react-dom --save

答案 9 :(得分:0)

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

Parcel 可以通过 3 种方式从您的 package.json 中推断:

enter image description here

删除节点作为目标,或在命令行指定--targetbrowser

另见:

答案 10 :(得分:0)

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

sudo npm install -g react-dom@17.0.2