NPM Tool Window
- the tool window can be accessed this way
only after you have opened it using the command.
On this page:
- Accessing the npm Tool Window
- Building a Tree of npm Scripts
- Running npm Scripts
- Toolbar
- Context Menu of a Tree
- Context Menu of a Script
Accessing the npm Tool Window
The tool window is available only when:
- The Node.js runtime environment is installed on your computer.
- The NodeJS plugin is enabled. The plugin is bundled with WebStorm and activated by default. If the plugin is not activated, enable it on the Plugins page of the Settings / Preferences Dialog as described in Enabling and Disabling Plugins.
-
At least one
package.json
file is available in the current project.
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.
Use the tool window to run npm scripts.
As soon as you invoke npm, it starts building a tree of scripts defined within the scripts
property of the package.json
file on which it was invoked.
If you have several package.json
files in your project, you can build a separate script tree for each of them and run scripts without abandoning the previously built trees.
Each tree is shown under a separate node.
Building a Tree of npm Scripts
To build a tree of scripts, 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. -
If the npm tool window is already opened, click on the toolbar and
choose the required
package.json
file from the list. WebStorm adds a new node and builds a scripts tree under it. The title of the node shows the path to thepackage.json
file according to which the tree is built.
Running npm Scripts
To run a script from the tree, 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.
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.
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.