debugging.md

Setting up debug environment

Once you have set up a launch.json file with default configurations, you can modify these configurations, or add new ones to the list. You can use other fields in these configurations as well.

For example, you can modify the target field to specify the simulator you want to target for iOS debugging or the device using the one from output of adb devices command for Android debugging.

Debugging with TypeScript and Haul

If you use Haul instead of the react-native packager, you must add sourceMapPathOverrides to the launch.json file.

For example:

"sourceMapPathOverrides": {
    "webpack:///./~/*":   "${workspaceRoot}/node_modules/*",
    "webpack:///./*":   "${workspaceRoot}/*",
    "webpack:///*":     "*"
}

See more about source map overrides here

Specifying scheme for iOS app

If you want to use custom scheme for your application you can either pass it as part of runArguments parameter arguments or set scheme configuration parameter as shown below:

"runArguments": ["--scheme", "customScheme", ...]
// or
"runArguments": ["--scheme=customScheme", ...]
// or
"scheme" : "customScheme"

Please be aware, specifying scheme value as a part of runArguments parameter arguments will override scheme configuration parameter value if it set.

Debugging on iOS device

Debugging on an iOS device require following manual steps:

• Install ios-deploy npm install -g ios-deploy.
• Have a valid iOS Development certificate installed.
• In your project's launch.json file set target to device or use 'launchArguments' property to specify particular device to run on in case of multiple devices connected, e.g. "runArguments": [ "--device", "My iPhone" ]
• Choose Debug iOS configuration from the Configuration dropdown and press F5.
• Shake the device to open the development menu and select "Debug JS Remotely".

Debugging React Native Windows

For UWP apps use windows target platform in launch.json configuration, e.g.:

{
    "name": "Debug UWP",
    "program": "${workspaceRoot}/.vscode/launchReactNative.js",
    "type": "reactnative",
    "request": "launch",
    "platform": "windows"
}

For WPF apps use wpf, e.g.(WPF debugging available only for react-native-windows gt 0.55.0):

{
    "name": "Debug WPF",
    "program": "${workspaceRoot}/.vscode/launchReactNative.js",
    "type": "reactnative",
    "request": "launch",
    "platform": "wpf"
}