如何修复 React Developper Tools 在默认 React 页面上给出的错误消息？

Question

概括

我想检查 React 应用程序上的元素，但我在 Google Chrome 上的 React Developper Tools 不起作用。

问题

浏览器 React Developper 上的错误消息

This page is using the development build of React. 🚧

Note that the development build is not suitable for production.
Make sure to use the production build before deployment.

Open the developer tools, and "Components" and "Profiler" tabs will appear to the right.

我试图做的

成功构建和执行示例反应应用程序。

npm init react-app react_app
npm start

我可以在http://localhost:3000/上看到默认的 React 屏幕，并且我没有编辑创建的 React 应用程序文件夹。

但是，我的 React Developper 无法使用红色警告图标。

Answer 1

运行这个命令

npm run build

Answer 2

我认为没有问题，只是您处于开发模式的信息

如果您在开发模式下访问带有 React 的站点，图标将具有红色背景： 带有开发版本 React 的网站上的 React DevTools 预计您在开发应用程序时使用开发模式，部署时使用生产模式您的应用程序给用户。

检查此 URL [ https://reactjs.org/docs/optimizing-performance.html#use-the-production-build]

Answer 3

我遇到了同样的问题，然后我尝试在 chrome (ctrl + shift + N) 中的隐身窗口中工作。 此外，您可以清除缓存或打开一个新选项卡并在那里尝试。