使用React DevTools检查组件渲染

开放Beta测试文档 作为预发布开放Beta测试的一项内容，亚马逊提供了此技术文档。随着亚马逊收到反馈并对功能进行迭代，所描述的这些功能可能会发生变化。有关最新功能的信息，请参阅发行说明。

React DevTools可帮助您在Vega应用中调试和分析React组件渲染。它可提供：

本页介绍如何对Vega应用安装、配置和使用React DevTools。

先决条件

有关设置说明，请参阅安装Vega SDK和构建Vega应用。

全局安装React DevTools。
已复制到剪贴板。
```
 npm install -g react-devtools@6.0.1
```
转发所需的端口以激活连接。

React DevTools通过端口8097进行连接，而React Native打包器使用端口8081。
```
kepler device start-port-forwarding -p 8097 -f false -d <<设备序列号>>
kepler device start-port-forwarding -p 8081 -f false -d <<设备序列号>>
```
对于Vega虚拟设备测试，请使用VirtualDevice作为«设备序列号»。
启动React DevTools。
已复制到剪贴板。
```
 npx react-devtools
```
在您的项目目录中启动React Native打包器。
已复制到剪贴板。
```
 npm start
```
运行应用的调试版本。
```
 kepler run-kepler <<调试VPKG路径>> <<交互性组件ID>>
```
当您的应用加载时，React DevTools会连接。如果需要，在打包器终端中按r重新加载。