如何调试React Native?

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

当前回答

对于android应用程序。按Ctrl+M选择调试js远程，它将在chrome浏览器中打开一个url http://localhost:8081/debugger-ui的新窗口。你现在可以调试应用程序在chrome浏览器

其他回答

你也可以使用自定义库，如果你不想摇你的真实手机每2分钟

我创建了一个库，允许你在开发模式下使用3个手指触摸而不是摇晃来打开开发菜单

https://github.com/pie6k/react-native-dev-menu-on-touch

你只需要在里面包装你的应用程序:

从react-native-dev-menu-on-touch导入DevMenuOnTouch; //或:import {DevMenuOnTouch} from 'react-native-dev-menu-on-touch'

class YourRootApp extends Component {
  render() {
    return (
      <DevMenuOnTouch>
        <YourApp />
      </DevMenuOnTouch>
    );
  }
}

当你必须在真正的设备上调试并且你有同事坐在你旁边时，它真的很有用。

对于Android应用程序，如果你正在使用Genymotion，你可以通过按CMD + m来切换菜单，但你可能必须在菜单中启用它。

取消小部件通过CMD + m单击debug在chrome中启用它

非常简单，只有两个命令

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

假设你想在Android模拟器上显示这个菜单

然后，尝试⌘+m在Mac上的Android模拟器上弹出这个开发设置对话框。如果没有显示，那么转到AVD >(点击笔编辑模拟器配置)>高级设置>检查启用键盘输入框。然后重试⌘+m。如果它没有显示静止，那么去运行模拟器设置和发送键盘快捷键到组合框/下拉菜单，然后选择模拟器控件(默认)选项。

然后重试⌘+m。我希望这对你有帮助，它对我有用。

在模拟器上按Cmd+D并选择Debug将打开浏览器调试器

推荐文章