如何调试React Native?

当应用程序在应用模拟器中运行时，如何用React Native调试他们的React代码?

当前回答

在模拟器- react-native Run -ios中运行你的应用程序按ctrl + d，然后点击Debug JS remote

网页应该在http://localhost:8081/debugger-ui打开，如果没有输入URL，在Chrome中进入这个链接右键点击页面，点击检查，它应该打开chrome开发工具

转到顶部菜单中的源代码，在右侧的文件资源管理器中找到你的js类文件您可以将断点放到视图中，并在其中调试代码，如图所示。

其他回答

除了其他答案。可以使用调试器语句调试react-native

例子:

debugger; //breaks execution

你的chrome开发工具必须打开这工作

对我来说，在React-Native上调试的最好方法是使用“Reactotron”。

安装Reactotron，然后将这些添加到你的package.json:

"reactotron-apisauce": "^1.1.2",
"reactotron-react-native-under-37": "^1.1.2",
"reactotron-redux": "^1.1.2",

现在，只需要登录您的代码。例如:console.tron.log(调试)

试试这个程序:https://github.com/jhen0409/react-native-debugger

适用于:windows, osx和linux。

它支持:react native和redux

你还可以检查虚拟组件树，修改应用中反映的样式。

非常简单，只有两个命令

For IOS $ react-native log-ios
For Android $ react-native log-android

奇怪的是，⌘+ D对我不起作用。在iOS模拟器中按ctrl + cmd⌘+ Z确实为我打开了调试浏览器窗口。

这是弹出的屏幕:

详情请点击这里。

推荐文章