Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Create WebStorm run configurations from package.json "scripts" section

In my package.json file, I have the following "scripts" configuration.

...
"scripts": {
    "start": "watchify -o lib/index.js -v -d .",
    "build": "browserify . | uglifyjs -cm > lib/index.js",
    "test": "jest"
}
...

This allows me to run npm start, npm build and npm test from the command line.

This is great! But ideally, I would like to be able to run those tasks from within WebStorm using run configurations, due to how convenient the interface is. I have not been able to figure out how to do this.

Is there a way to create my own custom run configurations or automatically generate them from my package.json?

like image 695
akbiggs Avatar asked Feb 18 '15 05:02

akbiggs


People also ask

How do I run a script defined package in json?

To define an NPM script, set its name and write the script under the 'scripts' property of your package. json file: To execute your Script, use the 'npm run <NAME-OF-YOUR-SCRIPT>' command. Some predefined aliases convert to npm run, like npm test or npm start, you can use them interchangeably.

How do I add a configuration to WebStorm?

Add Run/Debug configurations to the Services window Select View | Tool Windows | Services 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.

How do I run a script in WebStorm?

To run a script, open it in the editor or select it in the Project tool window, and then select Run <script file name> from the context menu. WebStorm creates a temporary run/debug configuration of the type Node. js. To run a test, click the gutter icon next to it or press Ctrl+Shift+F10 .

How do I show npm scripts in WebStorm?

Press Shift twice to open the search window, start typing your query, for example, npm scripts , and select Show npm scripts from the list. Alternatively, select View | Tool Windows | npm from the main menu.


2 Answers

you can use Node.js Run configuration for this. For example, for 'npm start':

Working dir: /path/to/your/package.json

JavaScript file: /path/to/global/node_modules/npm/bin/npm-cli.js

Application parameters: run start

To find the global node_modules path from the command line use "npm root -g".

There is no way to auto-create run configurations from files. And the only way to create your own run configuration is developing a plugin - see http://confluence.jetbrains.com/display/IDEADEV/Run+Configurations

Update: since 2016.x, WebStorm provides a special run configuration - npm - for running/debugging NPM scripts. It can be created manually via Edit configurations... dialog, or auto-added by selecting the script in NPM tool window (can be opened from package.json right-click menu).

See https://www.jetbrains.com/help/webstorm/2017.3/running-npm-scripts.html

like image 105
lena Avatar answered Oct 30 '22 02:10

lena


WebStorm and IntelliJ 2016 included support for NPM scripts as part of the NodeJS plugin.

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.

For more details check out their documentation.

like image 21
Diego V Avatar answered Oct 30 '22 03:10

Diego V