react-devTools插件安装导致项目出错

已于 2022-03-28 13:55:06 修改
阅读量934 收藏
点赞数
文章标签： react.js
于 2022-03-28 13:53:12 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wd_nmdQGMZFJ/article/details/123793478
版权

在node_modules中找到ReactRefreshEntry.js文件(项目报错会映射到这个文件的) 将

RefreshRuntime.injectIntoGlobalHook(safeThis)   //  将这段代码注释  并重启项目
how to fail
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Chrome如何安装react-developer-tools插件及解决安装后报出的错误：Uncaught TypeError: Cannot read properties of undefined
念兮为美
07-06 2360
Chrome如何安装react-developer-tools插件及解决安装后报出的错误：Uncaught TypeError: Cannot read properties of undefined (reading 'forEach')——./node_modules/@pmmmwh/react-refresh-webpack-plugin/client/ReactRefreshEntry.js (ReactRefreshEntry.js:17:1)...............
react-devtools 最新插件
03-12
react-devtools 最新插件 react-devtools 最新插件 react-devtools 最新插件 react-devtools 最新插件 react-devtools 最新插件 react-devtools 最新插件 react-devtools 最新插件
React DevTools的浏览器详细安装教程及相关错误修改
享白
01-22 2372
今天分享给大家一个自己制作 React-devtools 小方法，制作完毕可以直接安装到Chrome中使用。 React DevTools安装： Github 地址：react-devtoolsGitHub is where over 73 million developers shape the future of software, together. Contribute to the open source community, manage your Git repositories, rev
启用React-devtools后，项目报错
梁什么鸭“的博客
10-05 664
我安装的是 最新版本的 v3 分支上的 react-devtools，根据官方文档一系列操作下来安装好了，然后运行项目报一下错误： 但是之前项目是正常运行的，于是上网搜索，发现大多数都是说直接禁用掉 react-devtools 这个插件，就无语，那我还安装它干啥？？嫌内存太多？？ 于是我又看了眼报错信息，然后根据如下报错信息 按照它的路径把我项目中对用的这段代码注释掉，然后重新 yarn start，就没有报错了 网上看了下，说这个是版本的原因，说之前的旧版本没有这个问题。 就酱，拜！ ...
React App 启动报错: Cannot read property ‘forEach‘ of undefined
qq_31688927的博客
08-23 199
安装了react-devtools插件后运行报错 解决方法： 打开node_modules/@pmmmwh/react-refresh-webpack-plugin/client/ReactRefreshEntry.js文件 注释掉代码：RefreshRuntime.injectIntoGlobalHook(safeThis); 解决问题
ERROR: child process failed, exited with 1
weixin_44533042的博客
05-05 1809
https://www.cnblogs.com/zlslch/p/6932368.html
在chrome(谷歌)浏览器中安装react插件
zzjbaifasanqian的博客
06-17 3031
在chrome(谷歌)浏览器中安装react插件 1.去到react的github上找到插件，并下载 https://github.com/facebook/react-devtools/tree/v3 项目解压，如下图所示 2.打开cmd界面，使用cd命令进入刚下载的项目 C:\Users\asus>d: D:\>cd D:\google下载\react-devtools 3.使用npm命令安装，使用此命令需要先安装 D:\google下载\react-devtools>npm --
使用react搭建的脚手架去运行项目，会发现和react浏览器插件或者react工具冲突，怎么解决？
yzkdcsdn的博客
11-30 944
日常在使用react搭建脚手架做项目的时候，在运行项目的时候会出现以下报错则意味着脚手架与浏览器已装的react工具也可以叫浏览器的react插件冲突，所以会导致页面不出来，呈现空白，报错如下: 解决方法如下： 1、关闭此插件和此工具 2、上面方法不适用，可以打开你的项目，找到所有依赖–node_modules,在此文件夹下找到@pmmmwh/react-refresh-webpack-plugin此文件夹，在文件夹下找到client文件夹并打开，此时会发现一个js文件，文件名为ReactRefresh
React-DevTools开发者工具安装
m0_49623851的博客
05-19 495
React-DevTools 安装好react-devtools后，可能项目会报错：Uncaught TypeError: Cannot read properties of undefined (reading ‘forEach‘)；
React-devtools-3.6.0.zip（最新版chrome的React插件）
07-28
chrome谷歌浏览器，打开空白页，地址栏chrome://extensions/打开扩展程序页面（开发者模式），将下载的React-devtools-3.6.0.zip拖拽到该页面，安装成功。
react Chrome插件开发者工具 react-devtools
06-18
解压压缩包，打开Chrome扩展程序的开发模式，加载解压文件选中解压的文件即可。
react-devtools-chorme插件.zip
07-13
react的调试工具
react-devtools.zip
06-05
react-devtool版本的手动编译版——适用于离线安装chrome extensions
React基础知识大汇总
qq_36828822的博客
04-21 917
如果在多个组件中使用了相同的useEffect或useState逻辑，推荐将这些相同的逻辑封装到函数中，这些函数被称为自定义的Hooks。下面举例3个自定义的Hooks的示例。useForceUpdate：返回一个让组件重新渲染的函数。// 调用 forceUpdate 函数来强制组件重新渲染usePrevVal：获取状态的上一次的值，它利用了Ref的可变性，以及effect在DOM被绘制到屏幕上才执行的特性。
React vs React Native写法上的不同
Ranye的博客
04-23 512
从标签和样式两个角度，快速从react过渡到react native
react引入iconfont的svg图标
qq_23858785的博客
04-23 285
react引入iconfont的svg图标
react之渲染与props
weixin_73918953的博客
04-23 852
要传递 props，请将它们添加到 JSX，就像使用 HTML 属性一样。要读取 props，请使用解构语法。你可以指定一个默认值，如size = 100，用于缺少值或值为undefined的 props。你可以使用JSX 展开语法转发所有 props，但不要过度使用它！像这样的嵌套 JSX，将被视为Card组件的childrenprop。Props 是只读的时间快照：每次渲染都会收到新版本的 props。你不能改变 props。当你需要交互性时，你可以设置 state。
React 15~18每个阶段更新了什么
04-26 412
React.createClass （弃用）class 组件函数组件（无状态、纯UI组件）堆栈diff（state1->state2->state3…、每个更新过程。
【React】CSS 局部样式
最新发布
小秀的博客
04-26 161
的时候，如果 CSS 文件名包含 module，那么说明该 CSS 是一个局部 CSS 样式文件，类似于 vue 中的 scoped。
react-devtools安装教程
06-28
### 回答1： 1. 首先，你需要在你的项目中安装 React 开发工具。你可以通过运行以下命令来安装它： ``` npm install -g react-devtools ``` 2. 安装完成后，你可以通过以下命令来启动 React 开发工具： ``` react-devtools ``` 3. 如果你使用的是 Chrome 浏览器，你还可以通过以下步骤来安装 React 开发工具的 Chrome 扩展程序： - 打开 Chrome 浏览器，进入 Chrome 网上应用店。 - 在搜索框中输入“React Developer Tools”。 - 点击“添加至 Chrome”按钮，等待安装完成。 - 安装完成后，你可以在 Chrome 浏览器的开发者工具中找到 React 开发工具的选项卡。 4. 安装完成后，你可以在你的 React 应用程序中使用 React 开发工具来调试和分析你的组件。 ### 回答2： React DevTools是React官方推出的调试工具，它可以帮助开发人员更方便地调试React应用程序。安装React DevTools非常简单，下面是安装步骤。 第一步：准备工作 首先，我们需要在项目中安装React，由于React是通过npm包被安装，因此需要在项目中运行以下命令进行安装： ``` npm install react ``` 接着，我们需要在项目中安装React DevTools。React DevTools是一个Chrome浏览器的扩展程序，因此需要在Chrome浏览器中进行安装。 第二步：安装React DevTools 在Chrome浏览器中搜索React DevTools，然后找到它的官方扩展程序页面。在页面中，我们可以看到添加到Chrome的按钮。点击这个按钮，Chrome浏览器就会自动下载并安装React DevTools。 安装完成后，我们可以在Chrome浏览器的扩展程序中看到React DevTools的图标。这个图标就是我们调试React应用程序的入口。 第三步：调试React应用程序 要使用React DevTools调试React应用程序，我们需要先启动React应用程序。在应用程序中，点击浏览器地址栏左侧的React图标，就可以打开React DevTools面板。 在面板中，我们可以看到所有React组件的结构和状态。我们可以查看组件的props、state、context、refs，也可以在控制台中进行组件的调试。 总之，使用React DevTools可以给React开发带来很大的便利，可以帮助开发人员更好地调试React应用程序。 ### 回答3： React DevTools是React开发中重要的调试工具之一，它能够帮助开发者快速诊断和调试React代码。在本篇文章中，我们将会提供React DevTools的安装教程，帮助大家快速上手。 安装流程： 1. 打开Chrome浏览器 2. 进入Chrome Web Store，搜索React DevTools 3. 安装React DevTools插件 4. 安装完成后，在Chrome浏览器工具栏中找到“React DevTools”图标。 5. 点击“React DevTools”图标，打开开发者工具。 安装完成后，我们可以采用以下步骤测试是否成功安装React DevTools： 1. 打开一个React应用程序，例如一个React页面。 2. 打开Chrome浏览器开发者工具 3. 点击“React”选项卡，在“React DevTools”中可以看到React组件的树形结构，并可以针对每个组件进行诊断和调试。 React DevTools的优点： 1.可视化组件树形结构，快速定位React组件的问题。 2.元素检查器，可快速查看组件的属性值。 3. 支持多种React版本，包括React Native。 4. 支持调试React Hoc、Context、组件性能等问题。 5. 增强了调试效率，提高了工作效率。 总结： React DevTools是一个非常强大的React调试工具，为React开发提供了很大的便利性。我们可以通过以上步骤轻松安装React DevTools，并在React开发中快速诊断和调试React代码。同时，我们也需要注意安全性，只在开发阶段安装使用，不要滥用浏览器插件，避免数据泄露。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值