Passing arguments to combined npm script - node.js

I have in my package.json the following
"scripts": {
...
"prod": "gulp build --production && webpack --env.config=production"
}
I now want to pass a parameter "theme" to both gulp and webpack to be able to adjust the output of the build process from the command line.
I figured out how to pass it to webpack: npm run prod -- --env.theme=themename but gulp does not take care of this. I also played around with the yargs-package, processs.argv and bash string substitution by changing the npm script to "gulp build --production \"$1\" && webpack --env.config=production" but that did not work out either.
How can this be achieved? What am I missing? Any hints highly appreciated!

If you're using Bash you can use a function in your npm-script.
For instance:
"scripts": {
...
"prod": "func() { gulp build --production \"$1\" && webpack --env.config=production \"$1\"; }; func"
}
However, for a cross-platform solution you'll need to consider invoking a nodejs script which exec's the commands - in a similar way shown in Solution 2 of my answer here.

Related

How to run few npm scripts in one-line shell command?

I have three scripts in package.json:
Watch server TypeScript
Nodemon
Webpack
"scripts": {
"watch-server": "tsc --watch --project ./server/tsconfig.json",
"watch-node": "nodemon --watch ./server/build/ --watch ./server/templates -e js,json,pug",
"watch-client": "webpack --config ./webpack/webpack.dev.conf.js --watch"
}
Everytime I start my computer and open VS Code I need to open three separate PowerShell terminals and type in those commands one-by-one. Is there any way to launch these three separate terminals with their own commands in one shell command? Maybe via tasks.json?
On linux or any bash terminal, you can use && to combine multiple commands, i
You can do as
npm run watch-server && npm run watch-node && npm run watch-client
A quick google search for powershell suggested using semicolon
so on powershell you can do something like below if using && does not work
npm run watch-server;npm run watch-node ; npm run watch-client
Also keep in mind, you can additionally add fourth command in your npm scripts in package.json where you can use one of these combined commands which works for you, like
start-all: npm run watch-server && npm run watch-node && npm run watch-client
and then run
npm run start-all

Multiple commands in package.json

This command: "start": "node server/server.js" starts my server, but before running this I also want a command to run automatically:
'webpack'.
I want to build a script that can be run with
npm run someCommand - it should first run webpack in the terminal, followed by node server/server.js.
(I know how configure this with gulp, but I don't want to use it)
If I understood you correctly, you want firstly run webpack and after compile run nodejs. Maybe try this:
"start": "webpack && node server/server.js"
The following should work:
"start": "webpack && node server/server.js"
Though, for readability (and especially if you plan on adding additional tasks in the future), you may want to consider creating separate entries for each task and then calling each of those from start. Something like:
{
"init-assets": "webpack",
"init-server": "node server/server.js",
"start": "npm run init-assets && npm run init-server"
}
Better understand the && operator
In my case the && didn't work well because one of my commands sometimes exited with non zero exit code (error) and the && chaining operator works only if the previous command succeeds.
The main chaining operators behave like this:
&& runs the next command only if the first succeeds (AND)
|| runs the next command only if the first fails (OR)
So if you want the second command to run whatever the first has outputted the best way is to do something like (command1 && command2) || command 2
Others OS specific chaining operators
Other separators are different in a Unix (linux, macos) and windows environnement
; UNIX run the second command whatever the first has outputted
; WIN separate command arguments
& UNIX run first command in the background parallel to the second one
& WIN run the second command whatever the first has outputted
All chaining operators for windows here
and for unix here
You can also chain commands like this:
"scripts": {
"clean": "npm cache clean --force",
"clean:complete": "npm run clean && npm uninstall -g #angular/cli && rmdir /Q /S node_modules",
"clean:complete:install": "npm run clean:complete && npm i -g #angular/cli && npm i && npm install --save-dev #angular/cli#latest"
}
Also, along with the accepted answer and #pdoherty926's answer, in case you want to have run two command prompts, you can add "start" before each command:
{
"init-assets": "webpack",
"init-server": "node server/server.js",
"start": "start npm run init-assets && start npm run init-server"
}

package.json scripts that work with npm and yarn?

I am using npm as a build tool and so in my package.json, and some of my scripts depend on other scripts:
{
"test": "npm run lint && mocha"
}
This hardcodes the npm package manager into package.json. How can make this approach to expressing dependencies work with both npm and yarn?
The $npm_execpath environment variable refers to the build tool, so just replace npm with the $npm_execpath:
{
"test": "$npm_execpath run lint && mocha"
}
Both npm test and yarn test will work, and will use the appropriate build tool.
While mjs' answer is great, there's also a small package that is purported to work on all environments including Windows: https://www.npmjs.com/package/yarpm
To use in a project, run yarn add yarpm --dev / npm i -D yarpm and then just use yarpm in your scripts like this:
{
"test": "yarpm run lint && mocha"
}
As the package README notes, you just need to make sure your commands would be suitable for passing through to either yarn or npm: you cannot use arguments/flags that only work on one package manager.

How to pass argument to npm script with AND operator

I have one npm script:
scripts: {
"deploy": "npm run build && ./deploy.sh"
}
we can pass an argument to the script: npm run deploy -- --env=prod
but the problem is the command before the AND operator didn't get the argument injected, is there a way to pass the argument with the && operator?
I am expecting a way likeļ¼š
scripts: {
"start": "npm run build -- arg[0] && ./deploy.sh"
}
or any correct or better way to get there, any suggestion will be appreciated.
I try in this way and it seams to work
"start":"npm run build -- {{process.argv}} && ./deploy.sh"

Reference npm script from npm script

Consider the following example package.json fragment:
{
// ...
"scripts": {
"start": "npm run b -- --watch",
"build": "builder --in src --out dest"
}
// ...
}
In this, I run build from start, and give it an extra flag. The problem with this approach is it actually creates another instance of the NPM run. It works, but it's ugly.
Is there a clean way to reference the build command from the start command without having to make another call to NPM?
Is there a clean way to reference the build command from the start command without having to make another call to NPM?
Not really.
If you just don't like npm's verbose output, you can silence that with npm run b -s -- --watch.
If you are calling multiple npm scripts from one parent script, you may want to look into an npm task runner. Here is a list of a few: https://github.com/RyanZim/awesome-npm-scripts#task-runners. (Disclaimer: awesome-npm-scripts is my personal project)

Resources