react native项目增加devtools工具

Posted weschen

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了react native项目增加devtools工具相关的知识,希望对你有一定的参考价值。

第一步:安装react devtools工具

在当前项目中打开命令行,添加react devtools工具,因为运行的工具有九十几M,下载时需要时间,请耐心等待

yarn add react-devtools

 

第二步:配置package.json中命令

编辑package.json文件,在scripts节点中增加devtools节点,命令为

"devtools": "react-devtools"

 

技术分享图片

 

第三步:运行react devtools命令

1.正常运行项目,使用命令react-native run-android即可在模拟器中打开项目

2.打开新的命令窗口,使用命令yarn run devtools即可打开react devtools工具,打开工具后几秒应该可以自动连接至运行的项目

 技术分享图片

 

以上是关于react native项目增加devtools工具的主要内容,如果未能解决你的问题,请参考以下文章

react-native 的 react-devtools

在解析模块`react-native/Libraries/Core/Devtools/getDevServer`时,发现了Haste包`react-native`

无法在 React Native 中连接 remote-redux-devtools

调试 React-Native 应用程序时如何在 Chrome devtools 中查看 React 选项卡?

React Native 中的 Rect DevTools 错误:无法检查具有 id 的元素

react native 增加react-native-camera