无法解析模块“react-dom”
Posted
技术标签:
【中文标题】无法解析模块“react-dom”【英文标题】:Cannot resolve module 'react-dom' 【发布时间】:2017-07-23 07:31:53 【问题描述】:我见过很少有与此类错误相关的帖子。但我无法解决。
我的 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
但是在我做的时候在命令行中
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
请帮忙。
【问题讨论】:
这为我解决了:***.com/a/47722556/15441 【参考方案1】:您的应用指向 react 的全局版本,因此您需要使用 global 关键字手动安装它。您还可以使用命令npm -v react-dom
比较您在当前项目的 package.json 中安装的 react-dom 版本和全局安装的 react-dom 版本,如果两者不同,则使用命令手动安装 react dom:
sudo npm install -g react-dom@17.0.2
【讨论】:
【参考方案2】:对于那些使用 Parcel 的用户,如果您将 Node
定位为基于浏览器的应用程序,则可能会发生这种情况。
Parcel 会通过 3 种方式从您的 package.json
推断出这一点:
删除节点作为目标,或者在命令行中将--target
指定为browser
。
另见:
https://v2.parceljs.org/getting-started/migration/ https://v2.parceljs.org/configuration/package-json/【讨论】:
【参考方案3】:以下命令将解决问题。
npm install react react-dom --save
【讨论】:
【参考方案4】:就我而言,我的 webpack.config.common.js 中有一个别名:
resolve:
extensions: ['.js', '.jsx'],
alias:
'react-dom': '@hot-loader/react-dom',
,
,
我刚刚删除了这一行:
'react-dom': '@hot-loader/react-dom',
它已修复。
【讨论】:
或者确保安装了@hot-loader/react-dom。 那么你就不能从@hot-loader中受益 随着人们切换到 react-refresh,这种情况会发生得更多。【参考方案5】:就我而言,它是我在 webpack.conf 中的别名,它正在寻找 @hot-loader/react-dom
。
【讨论】:
【参考方案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
【讨论】:
【参考方案7】:我遇到此错误的特殊问题:
./src/index.js 中的错误未找到模块:错误:无法解析 'eact-dom' 在 'C:\Users\Jose\Desktop\woz-u-React\React-Course\react-lesson-one\src' @ ./src/index.js 2:0-32 @多 (webpack)-dev-server/client?http://localhost:8080./src/index.js
为了解决这个问题,我必须在安装前解压文件夹。
【讨论】:
【参考方案8】:如果您使用 npm 而不是 yarn,请尝试 rm -rf node_modules && yarn
或 rm -rf node_modules && npm install
。
【讨论】:
【参考方案9】:我使用了“npm update”,这解决了我的问题。
【讨论】:
【参考方案10】:对于任何阅读此内容但无法弄清楚的人。我遇到了同样的问题,我最终通过安装 "react-router" package 解决了这个问题,它只是运行以下命令
npm i react-router-dom --save
用于浏览器应用程序。
npm i react-router-native
用于原生应用。
【讨论】:
【参考方案11】:问题是react-dom
没有安装,当你点击npm -v react-dom
时,它给你的是npm
的版本而不是react-dom
的版本,你可以通过使用npm -v
或npm -v react-dom
来检查两者都会给出你同样的结果。
您检查的包版本不正确。
如何正确安装react和react-dom?
使用它来安装 react 和 react-dom:
npm install react react-dom --save
之后,您可以检查您的package.json
文件,如果react 和react-dom 已正确安装,您会找到相应的条目。
如何查看安装包版本?
查看所有本地安装的包版本:
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
【讨论】:
我在问题中说,安装 react-dom 后,出现这些错误。现在也是这样。以上是关于无法解析模块“react-dom”的主要内容,如果未能解决你的问题,请参考以下文章