Javascript 如何判断运行时在浏览器中运行的React版本？

是否有办法在浏览器中了解React的运行时版本？

React。您需要的是版本

但它没有文档记录（据我所知），因此它可能不是一个稳定的功能（即，尽管不太可能，但它可能会在未来的版本中消失或更改）

作为脚本导入的
React
示例


const REACT\u VERSION=REACT.VERSION；
ReactDOM.render(
反应版本：{React_version}，
document.getElementById（'root'））
);
打开Chrome开发工具或等效工具，并在控制台中运行
require（'React'）。version

这也适用于Facebook等网站，以了解他们使用的版本。
不确定是否已导出任何全局ECMAScript变量，html/css不一定表示React。因此，请查看.js

方法1：在ECMAScript中查找：

版本号由模块react dom和react导出，但这些名称通常通过捆绑删除，并且版本隐藏在无法访问的执行上下文中。聪明的断点可以直接显示值，也可以搜索ECMAScript：

加载网页（你可以试试看，他们都很酷）
打开源选项卡上的Chrome开发者工具（control+shift+i或command+shift+i）
开发工具在“源”选项卡上打开

在顶部菜单栏的最右侧，单击垂直省略号并选择“搜索所有文件”
在左侧下方的搜索框中，以大写字母键入已激发，清除复选框忽略大小写，键入输入
下面显示一个或多个匹配项。该版本非常接近搜索字符串，看起来像版本：“16.0.0”

如果版本号不立即可见：双击以行号开头的行
 ECMAScript出现在中间窗格
中

如果版本号不立即可见：单击ECMAScript窗格左下角的两个大括号{}
ECMAScript已重新格式化，更易于阅读

如果无法立即看到版本号：上下滚动几行以查找版本号，或尝试其他搜索键
如果代码未缩小，请搜索ReactVersion
应该有两个相同值的点击
如果代码缩小，则搜索机密\u内部\u不使用\u或\u您将\u被解雇或反应dom
或者搜索可能的版本字符串本身：“15.或“16.甚至”0.15

方法2：使用DOM断点：

加载由React呈现的页面
右键单击反应元素（任何内容，如输入字段或框），然后选择
Inspect element
Chrome开发者工具显示
元素
窗格

在树中尽可能从所选元素向上，但不高于React root元素（通常是直接位于主体内部的一个div，id为root:），右键单击一个元素并选择
断开…-子树修改
注意：可以将Elements选项卡（DOM当前状态）的内容与Networks选项卡上相同资源的响应进行比较。这可能会显示React的根元素

单击地址栏左侧的“重新加载”，重新加载页面
Chrome Developer Tools在断点处停止并显示
源代码
窗格


在最右侧窗格中，检查
调用堆栈
子窗格
在调用堆栈的最下面，应该有一个
render
条目，这是
ReactDOM.render
单击
render
下面的行，即调用render的代码
中间窗格现在显示ECMAScript，其中的表达式包含突出显示的.render
将鼠标光标悬停在用于调用渲染的对象上，即。
react dom
模块导出对象
如果代码行为：对象（u.render）（…，请将鼠标悬停在u

将显示一个工具提示窗口，其中包含
版本：“15.6.2”
，即
react dom导出的所有值

该版本也被注入React-dev工具，但据我所知，它没有显示在任何地方。
打开控制台，然后运行
window.React.version

在从0.12.2升级到16.2.0的过程中，这对我在Safari和Chrome中起到了作用。
对于使用创建的应用程序，我设法看到了以下版本：

打开Chrome开发工具/Firefox开发工具
搜索并打开main.XXXXXXXX.js文件，其中XXXXXXXX是构建哈希/可能不同
可选：通过单击{}以显示格式化的源来格式化源
以文本形式在源中搜索react dom
在Chrome中找到：“react dom”：“^16.4.0”
在Firefox中找到：“^16.4.0”
应用程序在部署时没有源映射。
在index.js文件中，只需将应用程序组件替换为“React.version”。
例如

我已经在现有项目中使用React v16.8.1检查了这一点。查看React版本的一个简单方法是转到任何组件的
渲染
方法并添加：

{React.version}

这假设您像这样导入React:
从“React”导入React
从命令行：

npm视图反应版本
npm视图反应本机版本
安装React Devtools后，您可以从浏览器控制台运行此操作：

__REACT_DEVTOOLS_GLOBAL_HOOK__.renderers.forEach(r => console.log(`${r.rendererPackageName}: ${r.version}`))

其输出类似于：

react-dom: 16.12.0

如果未安装，请首先安装React-dev工具，然后使用中的“在下面运行”代码
react-dom: 16.12.0

__REACT_DEVTOOLS_GLOBAL_HOOK__.renderers.get(1).version