Run/debug configurations
WebStorm uses run/debug configurations to run, debug, and test your code. Each configuration is a named set of run/debug startup properties.
If the Navigation bar is visible (), you can access all available run/debug configurations from the selector on the toolbar.
Run/debug configurations can be created as:
Temporary – created every time you select from the context menu. To call the context menu, right-click an object or an area.
The maximum number of temporary configurations is 5. The older ones are automatically deleted when new ones are added.Permanent – created explicitly from a template or by saving a temporary configuration. Permanent configurations remain as part of your project until you remove them.
So whenever you run/debug or test your code, WebStorm either uses an existing permanent run/debug configuration or creates a new temporary one.
Permanent configurations have opaque icons while the icons of temporary configurations are semi-transparent.
Create permanent run/debug configurations
WebStorm provides the following ways to create a permanent run/debug configuration:
Create from a template or copy an existing configuration.
Save a temporary configuration as permanent
Select a temporary configuration in the run/debug configuration switcher and then click Save Configuration.
Alternatively, select a temporary configuration in the Run/debug configurations dialog and click
on the toolbar.Open the Edit Configurations dialog (), select the temporary configuration to save, and click
on the toolbar.
WebStorm provides run/debug configuration templates for different languages, tools, and frameworks. The list of available templates varies depending on the installed/bundled plugins.
Create a run/debug configuration from a template
Open the Run/Debug Configuration dialog in one of the following ways:
Select from the main menu.
With the Navigation bar visible (), choose from the run/debug configuration selector.
Press Alt+Shift+F10, then press 0 or select the configuration from the popup and press F4.
In the Run/Debug Configuration dialog, click
on the toolbar or press Alt+Insert. The list shows the run/debug configuration templates.Select the desired template. If you are not sure which template to choose, refer to Run/debug configurations dialog for more information on particular templates.
Specify the run/debug configuration name in the Name field. This name will be shown in the list of the available run/debug configurations.
Select Allow parallel run if you want to allow multiple instances of the configuration to run at the same time. If this option is disabled, attempting to re-run the configuration will terminate the active session.
Set the run/debug configuration parameters. The list of mandatory and optional parameters may vary depending on the selected run/debug configuration type.
For the detailed description of the selected template, see the respective section of run/debug configurations reference.
In the Before launch section, define whether you want to perform any specific actions before launching the application, for example, execute some tools or scripts prior to launching the run/debug configuration.
For information on particular Before launch activities, refer to Before Launch
Apply the changes and close the dialog.
Share run/debug configurations
If you are working in a team, you might want to share your run/debug configurations so that your teammates could run the application using the same configuration or enable them to remotely attach to the process you are running.
For these purposes, WebStorm provides a mechanism to store your run/debug configurations as project files and share them through VCS. The same mechanism can also be used when you want to send your configuration as a file to someone else. This saves a lot of time as run/debug configurations sometimes get sophisticated, and keeping them in sync manually would be tedious and error-prone.
From the main menu, select . Alternatively, press Alt+Shift+F10, then 0.
Select the run/debug configuration you want to share, enable the Store as project file option, and specify the location where the configuration file will be stored.
If compatibility with WebStorm 2019.3 and earlier is required, store the file in the default location.
(Optional) If the .idea directory is added to VCS ignored files, the .idea/runConfigurations subfolder will be ignored, too. If you use Git for your project, you can share .idea/runConfigurations only and leave .idea ignored by modifying .gitignore as follows:
/.idea/* !/.idea/runConfigurations
Run/debug configuration templates
Each type of run/debug configuration is a template that you can edit, so the next time you create a new configuration of that type, its parameters already have the desired values.
Configure the default values for a template
From the main menu, select . Alternatively, press Alt+Shift+F10, then 0.
In the left-hand pane of the run/debug configuration dialog, click Edit configuration templates.
In the Run/Debug Configuration Templates dialog that opens, select a configuration type.
Specify the desired default parameters and click OK to save the template.
Alternatively, select from the main menu or press Shift twice and start typing Templates for New Projects.
In the dialog that opens, select the configuration type and specify the desired parameters in the right-hand pane.
Compound run/debug configurations
A Compound run configuration lets you launch several run/debug configurations at a time. This may happen when you need to debug the client-side code and the server-side code simultaneously while the server is started, for example, via npm.
Another case is when you need to start both your application and the database it uses. Just create a Shell Script configuration to start the database and a configuration of the relevant type to start your application and add them both to the Compound configuration.
Create a compound run/debug configuration
From the main menu, select . Alternatively, press Alt+Shift+F10, then 0.
In the Run/Debug Configurations dialog, click
or press Alt+Insert, then select Compound.Specify the run/debug configuration name in the Name field. This name will be shown in the list of the available run/debug configurations.
Select Store as project file to make this run/debug configuration available to other team members.
To include a new run/debug configuration into the compound configuration, click Add
and select the desired one from the list.Apply the changes.
Run/debug configuration folders
When there are many run/debug configurations of the same type, you can group them in folders so they become easier to distinguish visually.
Once grouped, the run/debug configurations appear in the list under the corresponding folders.
Create a folder for run/debug configurations
From the main menu, select . Alternatively, press Alt+Shift+F10, then 0.
In the Run/Debug Configurations dialog, select a configuration type and click
on the toolbar. A new empty folder for the selected type is created.Specify the folder name in the text field to the right or accept the default name.
Select the desired run/debug configurations and move them under the target folder.
Apply the changes. If a folder is empty, it will not be saved.
When you no longer need a folder, you can delete it Delete. The run/debug configurations grouped under this folder will be moved under the root of the corresponding run/debug configuration type.
Run/Debug configurations in the Services tool window
You can manage multiple run/debug configurations in the Services tool window. For example, you can start, pause, and stop several applications, track their status, and examine application-specific details.
Add Run/Debug configurations to the Services window
Select from the main menu or press Alt+8.
In the Services tool window, click Add service, then select Run Configuration Type.
Select a run/debug configuration type from the list to add all configurations of this type to the window.
Note that the tool window will only display the configuration types for which you have created one or more configurations.