Running NPM Scripts

On this page:

• Introduction
• Before you start
• Building a tree of scripts
• Running npm scripts from the tree of scripts
• Running tasks according to a run configuration
• Running npm scripts automatically
• Running a script as a as a before-launch task

Introduction

IntelliJ IDEA provides interface for running npm scripts. npm scripts support involves:

• Parsing package.json files, recognizing definitions of scripts.
• Building trees of scripts.
• Navigation between a script in the tree and its definition in the package.json file.
• Running and debugging scripts.
• Configuring the script execution mode and output.

Before you start

1. Download and install Node.js which contains npm.
2. Install and enable the NodeJS plugin. The plugin is not bundled with IntelliJ IDEA, but it can be installed from the JetBrains plugin repository as described in Installing, Updating and Uninstalling Repository Plugins and Enabling and Disabling Plugins.
3. Create a package.json file with the scripts property with the definitions of the scripts to run.
4. To enable debugging a script, add the $NODE_DEBUG_OPTION to its definition in the package.json file, for example:
   { "name": "application-name", "version": "0.0.1", "scripts": { "main": "node $NODE_DEBUG_OPTION ./app-compiled.js" } }

Scripts are launched in four ways:

• From a tree of scripts in the dedicated NPM Tool Window. The tool window opens when you invoke npm by choosing Show npm Scripts on the context menu of a package.json in the Project tool window or of a package.json opened in the editor.
• According to a dedicated run configuration, see Run/Debug Configuration: NPM.
• Automatically, as a start-up task.
• As a before-launch task, from another run configuration.

The result of executing a script is displayed in the Run tool window. The tool window shows the npm script output, reports the errors occurred, lists the packages or plugins that have not been found, etc. The name of the last executed script is displayed on the title bar of the tool window.

Building a tree of scripts

• If the npm tool window is not opened yet, do one of the following:
  • Select the required package.json file in the Project tool window and choose Show npm Scripts on the context menu of the selection.
  • Open the required package.json file in the editor and choose Show npm Scripts on the context menu of the editor.

  In either case, the npm tool window opens showing the scripts tree built according to the selected or opened package.json file.

• If the npm tool window is already opened, click on the toolbar and choose the required package.json file from the list. IntelliJ IDEA adds a new node and builds a scripts tree under it. The title of the node shows the path to the package.json file according to which the tree is built.
• To re-build a tree, switch to the required node and click on the toolbar.

Running npm scripts from the tree of scripts

• To run a script, do one of the following:

  • Double click the required script in the tree.
  • Select the required script and choose Run <script name> on the context menu of the selection.
  • Select the required script and press Enter.
• To run several scripts, use the multiselect mode: hold Shift (for adjacent items) or Ctrl (for non-adjacent items) keys and select the required scripts, then choose Run on the context menu of the selection.

Running tasks according to a run configuration

Besides using temporary run configurations that IntelliJ IDEA creates automatically, you can create and launch your own npm run configurations. For details about run configurations, see Run/Debug Configuration and Creating and Editing Run/Debug Configurations.

To create an npm run configuration:

1. Choose Run | Edit Configuration on the main menu. Alternatively, click Shift+Alt+F10 and select Edit Configuration from the pop-up menu.
2. Click the Add New Configuration button on the toolbar and select npm from the pop-up list.
3. In the Run/Debug Configuration: NPM dialog box that opens, specify the name of the run configuration, the npm command line command to execute, the scripts to run (use blank spaces as separators), the location of the package.json file to retrieve the definitions of the scripts from, and the command line arguments to execute the script with.

   Specify the location of the Node executable file and the NodeJS-specific options to be passed to this executable file, see Node parameters for details.

   If applicable, specify the environment variables for the NodeJS executable file.

To run a script according to a run configuration, select the run configuration from the list on the main tool bar and then choose Run | Run <configuration name> on the main menu or click the Run toolbar button . The output is displayed in the Run tool window.

Running npm scripts automatically

If you have some scripts that you run on a regular basis, you can add the corresponding run configurations to a list of startup tasks. The tasks will be executed automatically on the project start-up.

1. Open the Settings / Preferences Dialog by pressing Ctrl+Alt+S or by choosing File | Settings for Windows and Linux or IntelliJ IDEA | Preferences for OS X, and click Startup Tasks under Tools.
2. On the Startup Tasks page that opens, click on the toolbar.
3. From the drop-down list, choose the required npm run configuration. The configuration is added to the list.

   If no applicable configuration is available in the project, click and choose Edit Configurations. Then define a configuration with the required settings in the Run/Debug Configuration: NPM page that opens. When you save the new configuration it is automatically added to the list of startup tasks.

Running a script as a as a before-launch task

1. Open the Run/Debug Configurations dialog by choosing Run | Edit Configurations on the main menu, and select the required configuration from the list or create it anew by clicking and choosing the relevant run configuration type.
2. In the dialog box that opens, click in the Before launch area and choose Run npm script from the drop-down list.
3. In the NPM Script dialog box that opens, specify the package.json file where the required script is defined, select the script to execute, choose the command to apply to it, and specify the arguments to execute the script with.

   Specify the location of the Node.js interpreter and the parameters to pass to it.