Search code examples
debuggingtypescriptwebstorm

Debugging TypeScript in WebStorm using the remote debugger

I cannot get remote debugging to work for TypeScript files inside WebStorm. I am currently using WebStorm 6.0, TS compiler 0.8.3 and the Chrome JetBrains plugin 0.5.7.

For debugging purposes, the server I am using is a simple python server ran using the command -m http.server on my local machine in the same directory as my source files.

Wen I put a breakpoint on the compiled JS files resulting from compiling the original TypeScript files, WebStorm opens the correct remote TypeScript files, but in read only mode (so at least the remote debugging for JS files is working, as well as the .js.map files).

The problem comes when trying to put the breakpoints directly in the original TypeScript files, as the debugger doesn't trigger at all.

I cannot set the remote file url inside WebStorm as the Scripts tab inside the debugger lists only JS files.

Solution

  • I solved this issue by setting the remote directory of the entire project, and not individual files.

    WebStorm settings