这个调试工具可以调试 模拟器或者真机 和 web端上运行的项目,
在上面可以看到树形组件结构,并且可以在上面修改样式, 查看结构, 查看props 和 state, style等 使用很方便
直接修改样式, 模拟器上就会相应修改
安装
1: 安装依赖
npm install --save-dev react-devtools
**注意: **安装时间较长, 请耐心等待, 如果执行到这里时, 其实还没有结束, 需要在等待个几分钟
Paste_Image.png
2: 修改package.json, 添加devtools
"scripts": {
// ...
"devtools": "react-devtools"
}
3: 运行
npm run devtools
启动App, app启动后不用管它, 重新打开一个cmd, 在模拟器或真机上运行自己的项目
4: 运行项目,
运行你的启动项目的命令, 我这里是在android上运行 所以:
react-native run-android
项目启动后, App自动加载组件树形结构, 并在右侧显示 style, props, state等对应的信息,
网友评论