我正在使用 Visual Studio 代码 IDE 来开发本机应用程序，并且没有使用 expo 库。
在此之前，我在 android studio 工作，在那里进行调试非常简单明了。
现在对于 react-native，我想知道如何使用 Visual Studio 代码 IDE 调试我的应用程序？
如何在 Visual Studio 代码中调试 React Native 应用程序？
IT技术
reactjs
react-native
react-native-android
2021-04-03 04:28:12
2个回答
如果您想在 VS Code 本身中调试应用程序，就像在其他 IDE 中一样。然后在方法上可以按照以下步骤进行：
- 将
React Native Tools扩展（由 提供Microsoft）安装到 VS Code。
这是对 VS Code 的 React Native 功能的一个很好的补充。
- 然后从左侧菜单转到调试选项，然后单击添加配置。
如果它最初说，No Configuration那么您可以单击添加配置，然后选择 React Native 选项。
- 现在如果已经
Launch configuration添加，那么您可以单击添加配置按钮，然后您将看到更多与 React Native 相关的选项。
您可以添加配置为React Native: Attach to Packager，React Native: Debug to Android，React Native: Debug to iOS在你的launch.json文件。它存在于.vscode文件夹中。
- 然后在代码中添加断点。现在假设您的应用程序已经在模拟器上运行，那么您可以选择 option
Attach to Packager。
- 然后在模拟器或设备上打开开发人员选项（Windows + Android 为 Ctrl + M）并单击
Debug JS Remotely。
现在你的断点应该可以工作了。同样，如果您的应用程序尚未运行，那么您可以继续Debug Android或Debug iOS相应地。
步骤 1：通过摇动手机或在您的机器中输入此命令（如果您正在运行 android）打开手机中的应用设置。
adb shell input keyevent 82
Step2：选择Debug JS Remotely，这是第二个选项。步骤 3：在您的浏览器中输入 Urlhttp://localhost:8081/debugger-ui/
步骤 4：再次通过摇动或运行步骤 1 中显示的命令打开应用程序设置，然后选择重新加载选项，这是第一个选项
现在您可以在浏览器中获取所有控制台日志，还可以通过放置断点并逐步分析值来远程调试您的应用程序。