“找不到模块：错误：无法解析模块'react / lib / ReactMount'”

Question

我使用Reactjs和webpack来启动项目，当我在命令提示符下运行“node server”时，会出现如下错误：

Chrome浏览器开放成功，但也存在以下问题：

github是：（github.com/Yangqin0607/gallery）

这是package.json

NSHTTPCookieStorage *sharedHTTPCookieStorage = [NSHTTPCookieStorage sharedHTTPCookieStorage];
NSArray *cookies = [sharedHTTPCookieStorage cookiesForURL:[NSURL URLWithString:@"https://wwwexample.com"]];

Answer 1

此问题与react-hot-loader包有关。您使用的旧版本依赖于ReactMount.js文件夹中的node_modules/react/lib文件。

没有简单的单向修复方法，但你有几个选项：

1. 请尝试按照此处的说明操作：https://github.com/gaearon/react-hot-loader/blob/v3.0.0-beta.6/docs/README.md#usage-with-external-react（但到目前为止我一直不幸）

2. 删除热重新加载器以进行反应（在webpack.config删除'react-hot'加载程序）

3. 将react-hot-loader包更新为版本3（以下是如何执行此操作：https://github.com/gaearon/redux-devtools/commit/64f58b7010a1b2a71ad16716eb37ac1031f93915）。但是请注意，这个包现在已经有一段时间了......

4. 将您的反应版本回滚到包含lib文件夹中的ReactMount.js的版本（15.0.1用于让该文件在停止时不确定）。

更新：React Hot Loader 3目前处于测试阶段，提供更全面的升级指南：https://github.com/gaearon/react-hot-loader/tree/v3.0.0-beta.7/docs#migration-to-30

Answer 2

以上解决方案均不适合我。 剩下的时间用在github问题/评论的兔子洞中，权衡各种hacky解决方法的优点/缺点/可行性。

最快，最简单，＆＃34;我只是想解决我打算今天工作的原始问题＆＃34;对我有用的修复来自：https://github.com/gaearon/react-hot-loader/issues/417#issuecomment-261548082

在您的webpack配置中，将以下别名添加到resolve部分：

resolve: {
  alias: { 'react/lib/ReactMount': 'react-dom/lib/ReactMount' }
}

这是不一个稳定的长期修复，这是一个仅限开发的修复程序，因此您可以继续开发而不必被迫处理升级问题。

我仍然不能100％确定为什么我在我的应用中看到了这个问题，而不是另一个应用，这两个问题都是从fountain.js react-redux生成器生成的，并且具有相同的{{1} }。

Answer 3

您正在使用过时的react-hot-loader软件包，它使用react\lib\ReactMount内部的反应API。现在反应并没有允许这个问题。

尝试将其更新为最新版本：

$ npm install --save-dev react-hot-loader@latest

Answer 4

感谢您的所有答案。我已经解决了我的问题。

  

“此问题与react-hot-loader软件包有关。您使用的旧版本依赖于node_modules / react / lib文件夹中存在的ReactMount.js文件。”由cheesemacfly说。

所以这是我的解决方案： 1）将react-hot-loader更新到最新版本

npm install --save-dev react-hot-loader@latest

但这是与react-hot-loader相关的另一个问题

2）所以我从'cfg / dev.js'中删除了react-hot-loader 改变代码

loader: 'react-hot!babel-loader'

到

loader: 'babel-loader'

Answer 5

这可能只是一个依赖问题。它没有得到正确版本的反应或没有正确安装。

# update npm
$ npm install -g npm

# reinstall the generator-react-webpack package (note the global tags)
$ npm install -g yo
$ npm install -g generator-react-webpack

然后尝试生成您的应用。

Answer 6

我遇到了同样的问题，没有一个解决方案有效。然后我发现似乎缺少反应。我在安装和卸载postgreSQL的软件包之后遇到了问题。

所以我添加了它。 PS，我正在使用纱线

yarn add react

Answer 7

非常感谢cheesemacfly，我能够通过你的建议解决同样的问题，以消除＆＃39; react-hot＆＃39;来自装载机。

{
    test: /\.(js|jsx)$/,
    loaders: ['react-hot', 'babel'],
    exclude: /(node_modules|lib\/ckeditor)/
}

我改为：

{
    test: /\.(js|jsx)$/,
    loader: 'babel',
    exclude: /(node_modules|lib\/ckeditor)/
}

请务必更改“装载机”字样。到装载机＆＃39;因为你不再引用列表了。

Answer 8

Updating react-hot-loader didn't work for me, but removing the react-hot form the loaders list, by simply commenting it, fixed the issue:

{
    test: /\.js$/,
    exclude: /node_modules/,
    loaders: [
        // 'react-hot',
       'babel'
    ]
}

Answer 9

有两个问题在起作用：

1. 正确升级所有依赖项，
2. 使用webpack v. 3.11.0，请勿升级到webpack v. 4.00，
3. 将ReactJS降级为React v. 15.6.2。

打开package.json，其中包含一系列内容，例如......

"dependencies": {
  "jquery": "^3.2.1",
  "jquery-ui": "^1.12.1",
  "react": "^15.6.1",
  "react-dom": "^15.6.1",
  "react-scripts": "1.0.10",
  "webpack": "^3.6.0"
  (etc.)

然后在你的包基目录中运行这样的命令，它具有与上面列出的相同的依赖...

sudo npm install --save react@15.6.2 react-dom@15.6.2 react-scripts@latest webpack@3.11.0 jquery@latest jquery-ui@latest

TLDR答案： ^^^这是您实际需要运行的一个命令。

请注意特定于webpack的版本。

在此之后，一切为我工作！我检查了ReactJS版本，使用这个答案https://stackoverflow.com/a/36994601/2430549，我的package.json现在看起来像......

"dependencies": {
  "jquery": "^3.3.1",
  "jquery-ui": "^1.12.1",
  "react": "^16.4.0",
  "react-dom": "^16.4.0",
  "react-hot-loader": "^4.2.0",
  "react-scripts": "^1.1.4",

来源：JanTheHun的回答，https://github.com/angular/angular-cli/issues/9793

Answer 10

对我来说，它是 react-dom 的旧版本。

我将 react 和 react-dom 的版本更改为16.X（确切地说：“ react”：“ 16.13.1”，“ react-dom” ：“ 16.13.1”，），然后这个问题对我来说消失了。