在 Visual Studio Code 中调试?

新手上路,请多包涵

我按照说明在 VSCode 中进行调试

https://github.com/Microsoft/vscode-react-native

我用我的 MBP2015 用 USB 电缆连接了我的 Nexus 6P,并启用了开发人员选项和 USB 调试,但是当我在 VSC 中选择调试 Android 时,我得到了这个

[Error] "Could not debug. Android project not found."

我也附上了这张照片。

如果我想在 IOS 模拟器上进行调试,我选择在 VSC 中调试 IOS,然后我得到了这个并且模拟器没有启动

[vscode-react-native] Prewarming bundle cache. This may take a while ...
[vscode-react-native] Building and running application.
[vscode-react-native] Executing command: react-native run-ios --simulator
Scanning 772 folders for symlinks in /Users/me/reactnativework/my-app/node_modules (4ms)
ENOENT: no such file or directory, uv_chdir
[Error] "Could not debug. Error while executing command 'react-native run-ios --simulator': Error while executing command 'react-native run-ios --simulator'"

我在这里看到的关于类似问题的帖子很少,但没有一个得到回答或与我的问题不同。

如何使用断点调试最简单的 React Native 应用程序,以便我可以跟踪代码在 Visual Studio Code 中的执行方式?

这是我的launch.json

 {
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Debug Android",
            "program": "${workspaceRoot}/.vscode/launchReactNative.js",
            "type": "reactnative",
            "request": "launch",
            "platform": "android",
            "sourceMaps": true,
            "outDir": "${workspaceRoot}/.vscode/.react"
        },
        {
            "name": "Debug iOS",
            "program": "${workspaceRoot}/.vscode/launchReactNative.js",
            "type": "reactnative",
            "request": "launch",
            "platform": "ios",
            "sourceMaps": true,
            "outDir": "${workspaceRoot}/.vscode/.react"
        },
        {
            "name": "Attach to packager",
            "program": "${workspaceRoot}/.vscode/launchReactNative.js",
            "type": "reactnative",
            "request": "attach",
            "sourceMaps": true,
            "outDir": "${workspaceRoot}/.vscode/.react"
        },
        {
            "name": "Debug in Exponent",
            "program": "${workspaceRoot}/.vscode/launchReactNative.js",
            "type": "reactnative",
            "request": "launch",
            "platform": "exponent",
            "sourceMaps": true,
            "outDir": "${workspaceRoot}/.vscode/.react"
        }
    ]
}

原文由 pixel 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 860
2 个回答

发现使用Chrome可以调试、跟踪、断点,试过了,效果不错

原文由 pixel 发布,翻译遵循 CC BY-SA 3.0 许可协议

按着这些次序

  • 安装扩展 React-native Full Pack

在此处输入图像描述

  • 创建 Launch.json

在此处输入图像描述

  • 选择 调试 iOSAndroid 。添加断点并享受。

在此处输入图像描述

注意:请确保您启用 远程调试 JS

在此处输入图像描述

现在喝杯咖啡享受吧!

原文由 Tunvir Rahman Tusher 发布,翻译遵循 CC BY-SA 3.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题