create-react-app 开发服务器在没有安装React Dev Tools浏览器插件的情况下无法加载应用,

pw136qt2  于 3个月前  发布在  React
关注(0)|答案(4)|浏览(41)

描述问题

开发服务器在没有安装React Dev Tools的情况下无法提供应用的着陆页面,这限制了只能在安装了React Dev Tools插件的浏览器中进行开发。然而,尽管有用,但文档中没有提到React Dev Tools的要求。

你是否尝试恢复依赖项?

是的,没有成功。

❯ node -v
v14.15.4
❯ npm -v
6.14.10

注意 npm 不是最新的。npm@14.15.4 默认带有 node@14.15.4,但无论如何,最新版本的 yarn 仍然存在问题,所以这可能是内部原因导致的。

你在用户指南中搜索了哪些术语?

devtools
dev tools

环境

Environment Info:

  current version of create-react-app: 4.0.2
  running from /Users/designorant/.npm/_npx/11344/lib/node_modules/create-react-app

  System:
    OS: macOS 11.2
    CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
  Binaries:
    Node: 14.15.4 - ~/.nodenv/versions/14.15.4/bin/node
    Yarn: Not Found
    npm: 6.14.10 - ~/.nodenv/versions/14.15.4/bin/npm
  Browsers:
    Chrome: 88.0.4324.146
    Edge: 86.0.622.38
    Firefox: 84.0.2
    Safari: 14.0.3
  npmPackages:
    react: ^17.0.1 => 17.0.1
    react-dom: ^17.0.1 => 17.0.1
    react-scripts: 4.0.1 => 4.0.1
  npmGlobalPackages:
    create-react-app: Not Found

重现步骤

  1. 运行 npx create-react-app my-app
  2. 使用 npm startyarn start 启动项目

预期行为

CRA着陆页应该在 http://localhost:3000 可见

实际行为

http://localhost:3000 显示一个空白页面,并附带以下错误:

react-refresh-runtime.development.js:465 Uncaught TypeError: Cannot read property 'forEach' of undefined
    at Object.injectIntoGlobalHook (react-refresh-runtime.development.js:465)
    at Object../node_modules/@pmmmwh/react-refresh-webpack-plugin/client/ReactRefreshEntry.js (ReactRefreshEntry.js:8)
    at __webpack_require__ (bootstrap:856)
    at fn (bootstrap:150)
    at Object.1 (reportWebVitals.js:14)
    at __webpack_require__ (bootstrap:856)
    at checkDeferredModules (bootstrap:45)
    at Array.webpackJsonpCallback [as push] (bootstrap:32)
    at main.chunk.js:1

看着你, react-refresh-webpack-plugin

可复现的演示

恐怕没有现场演示,但重现只需要很短的时间。

jgwigjjp

jgwigjjp1#

事实证明,这个问题已经被报告过了(惊讶,惊讶),尽管是以非标准的方式,并且在实际导致问题出现时已经安静下来。

  1. compiled successfully,but websit is bank! #9922
  2. Cannot read property 'forEach' of undefined #10242
    目前,只要安装了 React Dev Tools (当前版本为4.10.1(2020年12月4日)) *,就会立即出现这个问题。
js5cn81o

js5cn81o2#

当应用程序在electron中运行时,有什么建议可以修复这个问题吗?我使用electron-devtools-installer,它成功启动并安装,但显然这还不够。

zxlwwiss

zxlwwiss3#

我在Browserstack测试我的web应用时遇到了类似的问题。关闭快速刷新对我有用。

ztigrdn8

ztigrdn84#

我在Browserstack测试我的网络应用时遇到了类似的问题。关闭快速刷新对我有用。

// env.local

FAST_REFRESH=false

这对我不起作用。我百分之百确定环境变量被正确识别,因为我在那里有更多的设置,它们都运行得很好。所以这不是我的问题。快速刷新仍然被加载,它仍然以同样的方式破坏网站。因此,这个技巧不起作用(尽管了解它对你的特定情况是有用的)。

相关问题