How to setup debugging in Visual Studio Code for React Native?

Question

I searched but I can't find any external sources except for Visual Studio Code docs, and just following those docs doesn't allow me to debug React Native apps both in iOS and Android.

I keep getting the error message (this one for Android, for iOS, is similar:

[vscode-react-native] [Warning] Couldn't import script at http://localhost:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false. Debugging won't work: Try reloading the JS from inside the app, or Reconnect the VS Code debugger: path must be a string

My launch.json file as:

{
    "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"
        }
    ]
}

I'm trying to debug both in the iOS simulator and in an Android device but the process never attaches to the external JS debugger.

Possible duplicate of Very new to React Native - Debugging in Visual Studio Code? — Vishal Dhanotiya
– Vishal Dhanotiya, Commented Aug 30, 2019 at 18:13

Amit Giri · Accepted Answer · 2024-07-17 06:11:11Z

1

You can use Reactotron for debugging your React native apps for both iOS and Android. follow the official documentation for setup.

edited Jul 17, 2024 at 6:11

answered May 6, 2024 at 18:35

Amit Giri

414 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Community Over a year ago

Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center.

Angel F Syrus · Accepted Answer · 2019-04-23 08:34:55Z

0

Go to debug option in vscode and select debugging type

select attach to packager
run your react native app by
```
    react-native run-android
```
-> shake the phone and select Debugg remote JS option

Done...

edited Apr 23, 2019 at 8:34

Angel F Syrus

2,0408 gold badges26 silver badges45 bronze badges

answered Apr 23, 2019 at 7:02

Sushant Patil

613 bronze badges

Comments

qadir husainee · Accepted Answer · 2019-04-23 06:51:15Z

-2

You can use Vscode extension "React native tools" for debugging react-native apps.

answered Apr 23, 2019 at 6:51

qadir husainee

1424 bronze badges

1 Comment

Alvin Cheng Over a year ago

I think he is already using that extention

Collectives™ on Stack Overflow

How to setup debugging in Visual Studio Code for React Native?

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related