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?
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
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.
Related
I have installed vite in my vue.js app. I start the app by typing npm run dev in the main project directory. In the package.json this is defined as:
"dev": "vite"
but if I try do run this command (or eg. vite build) 'manually' from main directory, I get an error:
bash: vite: command not found
I also figured out that when I set a new script:
"build": "vite build"
I can run this command also, although, again, running it manually will result in error as above.
This seems quite illogical to me. Can anybody explain how is it possible?
If you didn't install vite globally (using npm install -g), then the vite command will be in node_modules/.bin in your main directory. The npm run command temporarily adds that folder to your PATH so it can execute that command. Try running ./node_modules/.bin/vite to run it without npm.
I'm reading node js code wherein package.json I found the following script
scripts: {
start : 'some-dependency start'
}
So, when I run npm run start it's actually starting my application with a web server, serving static files in my project.
My question is how some-dependency start running? what it can do? how it can serve my static files. I see internally some-dependency using react-scripts. But I can't wrap my head around how all these things working.
react-scripts is a package that comes in built with create-react-app when you run npm run start it executes a script/program that is wrapped in react-scripts package you can see the script for start command here, in that you can see that the script invokes the webpack-dev-server which serves the bundled javascript on a server
Generally when you execute some script through package.json file the same happens, you need to specify a command/ invoke a script
for example consider following script present in package.json file
script: {
"development": " cd client/ && NODE_ENV=development webpack -w --config webpack.dev.config.js"
}
In the above example when you run npm run development the following things happen
changes the directory to client
Node environment is set to development
invokes the webpack with the config file webpack.dev.config.js present in the client directory
It executes what ever that is written in the config file
Feel free to ask doubts if any
In WebStorm if I add run configuration as "Meteor" app then debugging works fine.
Recently we moved to use NPM script npm start to start our app. This helped us to reduce sending settings of WebStorm run config to other team members.
When I start NPM script in debug mode in WebStorm, then it doesn't hit the breakpoint. I want to know should I do some kind of change in 'run config' so that WebStorm knows that it should run Meteor debugger.
Here is my run script in package.json
{
"scripts": {
"start": "MONGO_URL=mongodb://localhost/db meteor --settings private/settings.json",
},
}
meteor can only be debugged via Meteor run configuration; there is no way to debug it through NPM script.
You can specify environment variables and pass settings to Meteor right in your configuration
UPDATE: As it is explained in the question, this is not a duplicate because I have already tried adding the set keyword before the environment variable and that did not solve the problem.
I am in the process of learning node and typing examples from a book. The first examples deal with showing how the "http" module works and how to create a server to listen to requests. At some point the book asks to add the following line to the scripts section of the package.json file:
"server": "SERVERPORT=3002 node ./fiboserver"
When I try to run the example with npm run server I get the following error message:
'SERVERPORT' is not recognized as an internal or external command
I haven't been able to find any answer on the internet, at most I found that I could try:
"server": "set SERVERPORT=3002 node ./fiboserver"
But that doesn't help either, the only difference is that instead of the error message I get the command prompt again so apparently the server is never run.
I believe the author used a Linux machine, I am using a Windows 10 laptop.
I am really committed to learn Node and my line of work is on Windows environments. I believe that setting environment variables on package.json is important so I could really use some help in figuring this out.
Thank you.
Make it cross-platform by using cross-env:
"server": "cross-env SERVERPORT=3002 node ./fiboserver"
On Windows you have to separate the command of setting a variable from the one which runs the server with the && operator.
That being said, you have to do something like this:
"server": "set SERVERPORT=3002 && node ./fiboserver"
I've gone through the same problem and used one of the following methods.
Method 1
If I run (without using the npm wrapper script)
HOST=0.0.0.0 PORT=8000 ./node_modules/.bin/react-scripts start
it works fine. As Quentin says,
Must be something to do with how npm shells out then
To fix it, I've gone to package.json and changed the "start" script to
"start": "./node_modules/.bin/react-scripts start",
Then npm start works fine.
Method 2
Use the cross-env package.
For that install it using the following command
npm i cross-env
then go to package.json and change it to
"start": "cross-env ./node_modules/.bin/react-scripts start",
And then running npm start will also work fine:
You can set bash as package.json scripts runner and it's will work in windows and linux.
Just set it once:
for yarn yarn config set script-shell /bin/bash
for npm npm config set script-shell /bin/bash
Or "C:\\Program Files\\git\\bin\\bash.exe" instead /bin/bash
It's will allow you to run npm script cross-platform:
"server": "SERVERPORT=3002 node ./fiboserver"
Currently, if you are using a package.json file to manage your project's dependencies (whatever project it is, may it be a ruby, php, python or js app), by default everything is installed under ./node_modules.
When some dependencies have binaries to save, they're installed under ./node_modules/.bin.
What I need is a feature that allow me to change the ./node_modules/.bin directory for ./bin.
Simple example:
A PHP/Symfony app has a ./vendor dir for Composer dependencies, and all binaries are saved in ./bin, thanks to the config: { bin-dir: bin } option in composer.json.
But if I want to use Gulp to manage my assets, I create a package.json file, require all my dependencies and then run npm install.
Then, my wish is to run bin/gulp to execute gulp, but actually I have to run node_modules/.bin/gulp which is not as friendly as bin/gulp.
I've looked at package.json examples/guides on browsenpm.org and docs.npmjs.com, but none of them works, because they are here to define your own project's binaries. But I don't have any binaries, because I want to use binaries from other libraries.
Is there an option for that with NodeJS/NPM ?
You might consider adding gulp tasks to your package.json.
// package.json
{
"scripts": {
"build-templates": "gulp build-templates",
"minify-js": "gulp minify-js"
}
}
You can run any scripts specified in package.json by simply running the following:
$ npm run build-templates
$ npm run minify-js
You get the idea. You can use the gulp command inside the string without doing ./node_modules/.bin/gulp because npm is smart enough to put all scripts from ./node_modules/.bin/ into the path for that script execution.