WebStorm Debugger

How can we debug this using WebStorm?

I’ve tried running npm start run configuration with the WebStorm debugger, but it quits the process once it reaches a breakpoint. I’ve tried the suggestion here, https://github.com/kriasoft/react-starter-kit/issues/396#issuecomment-171331792 and it will show that the debugger is started, but the process quits when a breakpoint is reached and a tooltip is displayed in WebStorm that says “connection refused.”

[jtiscione]

• In Webstorm’s Run/Debug Configurations, create a “Node.js” configuration:
  • Under the “Configuration” tab, set “build/server.js” as the JavaScript file. Set the project root directory as the working directory. Also check the “Single instance only” checkbox. (Some Webstorm versions have a bug that requires you to add “–expose-debug-as=v8debug” as a Node parameter, or else it starts whining about v8debug not being enabled.)
  • Under the “Browser/Live Edit” tab, check the “After launch” checkbox, select which browser to use in the dropdown, check the “with JavaScript debugger” checkbox, and enter “http://localhost:3000” as the target URL. (Also check the “Single instance only” box on this tab too.)
• Run npm build
• Click debug on that configuration and it should stop on both server and client breakpoints.

[wladiston]

Apparently the process quits because node is running under a child process. What I did was add the --debug arg under the runServer.js and create a remote debugger. ... cp.spawn('node', ['--debug', serverPath] ...

It isn’t the best solution due I have to run the npm start first but at least the npm start and debugger work together.