Debug code

During a debugging session, you launch your application or file with the debugger attached to it. The debugger interferes the program execution and provides you with the information on what is happening under the hood. This facilitates the process of detecting and fixing bugs in your program.

With WebStorm, you can debug all kinds of applications written in JavaScript, TypeScript, or Dart: Node.js, React Native and Electron applications and, of course, client-side applications written using different frameworks. In addition to that, you can also debug unit tests and build scripts.

No matter what kind of code you are debugging, your experience with the WebStorm debugger is the same - you just put breakpoints and step through your actual source code even if you then compile it, WebStorm takes care of source maps.

During a debugging session, you can step through the application, examine it when suspended, resume program, evaluate expressions, change values on-the-fly, set watches, and more.

In WebStorm, the JavaScript debugger works out of the box and in most cases its default settings are sufficient. If necessary, you can configure the debugger as described in Configuring JavaScript debugger.

WebStorm supports debugging client-side applications running on the built-in or an external web server. Debugging can be performed only using Google Chrome and other browsers of the Chrome family.

This section describes the procedures that are common for various types of applications and frameworks. Also find more language- and technology-specific details:

• Debug JavaScript in Chrome

• Running and debugging Node.js

• Running and debugging a React application

• Running and debugging a React Native application

• Running and debugging TypeScript

• Running and debugging an Angular application

• Running and debugging Dart command-line applications

• Running and debugging Dart web applications