WebStorm debug breakpoints not working for Node.js project

Question

I am trying to set up debugging breakpoints in a Node project which is a React Native front end application.

I am using WebStorm v2020.3 and Node v15.14.0

My settings for the Node.js run configuration of the project:

I have set breakpoints across the project and none of them get triggered.

My settings for the debug "Attach to Node.js/Chrome" run configuration:

First, I run the project and get this output:

/usr/local/bin/node --inspect-brk /Users/lachlangrant/Git/RN-BILLI-APP/node_modules/react-native/cli.js start
Debugger listening on ws://127.0.0.1:9229/051a5d86-ad54-4a6c-bbaa-366bbe8a938e
For help, see: https://nodejs.org/en/docs/inspector

Next, I run the debugger and get this output:

Debugger attached.
                                                          
               ######                ######               
             ###     ####        ####     ###             
            ##          ###    ###          ##            
            ##             ####             ##            
            ##             ####             ##            
            ##           ##    ##           ##            
            ##         ###      ###         ##            
             ##  ########################  ##             
          ######    ###            ###    ######          
      ###     ##    ##              ##    ##     ###      
   ###         ## ###      ####      ### ##         ###   
  ##           ####      ########      ####           ##  
 ##             ###     ##########     ###             ## 
  ##           ####      ########      ####           ##  
   ###         ## ###      ####      ### ##         ###   
      ###     ##    ##              ##    ##     ###      
          ######    ###            ###    ######          
             ##  ########################  ##             
            ##         ###      ###         ##            
            ##           ##    ##           ##            
            ##             ####             ##            
            ##             ####             ##            
            ##          ###    ###          ##            
             ###     ####        ####     ###             
               ######                ######               
                                                          
(node:33264) Warning: Accessing non-existent property 'splice' of module exports inside circular dependency
(Use `node --trace-warnings ...` to show where the warning was created)
                 Welcome to React Native!
                Learn once, write anywhere



To reload the app press "r"
To open developer menu press "d"

Then I trigger the breakpoint using an emulator in Xcode, and nothing happens.

I have looked at a variety of threads including this one.

Any ideas? Thanks in advance.

Answer 1

what are you trying to debug - react-native/cli.js script or your React Native application? In the latter case, please use React Native run configuration. See https://www.jetbrains.com/help/webstorm/2021.1/react-native.html#ws_react_native_debug