如何在 Visual Studio Code 中为 React Native 设置调试？

Posted 2023-02-19

技术标签:

【中文标题】如何在 Visual Studio Code 中为 React Native 设置调试？【英文标题】：How to setup debugging in Visual Studio Code for React Native? 【发布时间】：2017-05-10 00:07:30 【问题描述】：

我进行了搜索，但除了 Visual Studio Code 文档外，我找不到任何外部资源，并且仅遵循这些文档不允许在 ios 或 android 中调试 React Native 应用程序。

我不断收到错误消息（Android 和 iOS 类似：

[vscode-react-native] [警告] 无法在以下位置导入脚本 http://localhost:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false。调试不起作用：尝试从应用程序内部重新加载 JS，或者重新连接 VS Code 调试器：路径必须是字符串

我的launch.json 文件为：


    "version": "0.2.0",
    "configurations": [
        
            "name": "Debug Android",
            "program": "$workspaceRoot/.vscode/launchReactNative.js",
            "type": "reactnative",
            "request": "launch",
            "platform": "android",
            "internalDebuggerPort": 9090,
            "sourceMaps": true,
            "outDir": "$workspaceRoot/.vscode/.react"
        ,
        
            "name": "Debug iOS",
            "program": "$workspaceRoot/.vscode/launchReactNative.js",
            "type": "reactnative",
            "request": "launch",
            "platform": "ios",
            "target": "iPhone 6s",
            "internalDebuggerPort": 9090,
            "sourceMaps": true,
            "outDir": "$workspaceRoot/.vscode/.react"
        ,
        
            "name": "Attach to packager",
            "program": "$workspaceRoot/.vscode/launchReactNative.js",
            "type": "reactnative",
            "request": "attach",
            "internalDebuggerPort": 9090,
            "sourceMaps": true,
            "outDir": "$workspaceRoot/.vscode/.react"
        ,
        
            "name": "Debug in Exponent",
            "program": "$workspaceRoot/.vscode/launchReactNative.js",
            "type": "reactnative",
            "request": "launch",
            "platform": "exponent",
            "internalDebuggerPort": 9090,
            "sourceMaps": true,
            "outDir": "$workspaceRoot/.vscode/.react"
        
    ]

我正在尝试在 iOS 模拟器或 Android 设备中进行调试，但该进程从未附加到外部 JS 调试器。

【问题讨论】：

Very new to React Native - Debugging in Visual Studio Code?的可能重复 【参考方案1】：

进入vscode中的调试选项并选择调试类型

选择附加到打包程序

通过

运行您的 React Native 应用程序