WebStorm 2024.2 Help

Bun

WebStorm supports the Debug Adapter Protocol (DAP), introducing the debugging experience for developers that use the Bun JavaScript runtime.

With the Bun integration, you can debug both JavaScript and TypeScript files.

Debug with Bun

Install Bun

Install Bun as described on the Bun official website.

Configure Bun

  1. Press Ctrl+Alt+S to open settings and then select Languages&Frameworks | Bun.

  2. Specify the path to the Bun executable file.

    The path to the Bun executable file defaults to your PATH environment variable, so if you leave the Bun field empty, the debugger attempts to detect the Bun executable file automatically.

Create a Bun run/debug configuration

Run/debug configuration: Bun
  1. Go to Run | Edit Configurations. Alternatively, select Edit Configurations from the Run widget on the toolbar.

    Open the Edit Configurations dialog

    In the Edit Configurations dialog that opens, click the Add button (the Add button) on the toolbar and select Bun from the list.

    Create a run/debug configuration, select type Bun

    The Run/Debug Configuration: Bun dialog opens.

  2. In the File field, specify the path to the main file of the application that starts it. This can be a JavaScript or a TypeScript file.

Start debugging

  1. Set the breakpoints in the code where necessary.

  2. Create a Bun run/debug configuration as described above.

  3. From the Run widget list on the toolbar, select the newly created Bun configuration and click the Debug button next to it.

    Start a Bun debugging session with a run/debug configuration

    The Debug tool window opens.

  4. Perform the steps that will trigger the execution of the code with breakpoints and Switch to WebStorm, where the controls of the Debug tool window are now enabled. Proceed with the debugging session — step through the breakpoints, switch between frames, change values on-the-fly, examine a suspended program, evaluate expressions, and set watches.

Last modified: 31 July 2024