npm scripts pass dynamic arguments from one script to the other - npm

How can I pass arguments from one script to the other
using npm-run-all (to run in parallel)
scripts:{
"start":"run-p dev watch -- --theme=$themeId",
"dev": "webpack",
"watch": "theme watch --env=$themeId"
}
Then calling start like:
npm run start theme=2233
But it wouldn't pass the argument to the watch argument

Using ${npm_config_themeId}
"scripts": {
"start": "run-p dev watch",
"watch": "theme watch --env=${npm_config_theme}",
}
Then calling
npm run start -theme=123

Related

How can I unset env variable when run npm script?

I have some npm scripts. Some of them use env variables. For example (just example):
"scripts": {
"start": "webpack --watch --env.noSourceMaps",
},
So, for now, when I call npm start env.noSourceMaps = true
But, how can I unset that variable when run npm start?
If I run npm run -- --env.noSourceMaps=false I got env.noSourceMaps = [true, 'false']
If I run npm run -- --env.noSourceMaps I got env.noSourceMaps = [true, true]
If I run npm run -- --env.noSourceMaps= I got env.noSourceMaps = [true, '']
But I want env.noSourceMaps = false or undefined
And I do not want to reverse logic (I mean, i don't want to use it as "start": "webpack --watch" and call it as npm start or npm start -- --env.noSouceMaps or "start": "webpack --watch", "start:noMaps": "webpack --watch --env.noSourceMaps")

npm - Pass arguments from CLI through multiple scripts

Let's say I have the following in a file called print-last-arg.js:
console.log(process.argv[process.argv.length-1])
And the following scripts in my package.json:
"scripts": {
"print_a": "node print-last-arg.js",
"print_b": "npm run print_a"
}
When I run npm run print_a -- --foo=bar, I get --foo=bar as expected.
However, npm run print_b -- --foo=bar gives me no output.
How do I pass the CLI arguments from print_b to print_a?
It turns out that you just have to add an extra -- on the end of print_b, which will tell npm to pass whatever arguments print_b got to print_a. So,
"scripts": {
"print_a": "node print-last-arg.js",
"print_b": "npm run print_a"
}
becomes
"scripts": {
"print_a": "node print-last-arg.js",
"print_b": "npm run print_a -- "
}
VoilĂ ! Now npm run print_b -- --foo=bar prints --foo=bar as expected.

Watches not working in vscode? (Vuejs)

It took me a while to get the debugger to work within Visual Studio Code. Now the program breaks on set breakpoints inside of .vue files/components. But none of the watches seem to work. They are either undefined or unavailable, even when the variables have been created.
The settings I use in launch.json :
{
"name": "chrome debug",
"type": "chrome",
"request": "launch",
"port": 3000,
"url": "http://localhost:3000/admin",
"webRoot": "${workspaceFolder}",
"breakOnLoad": true
// "sourceMapPathOverrides": {
// "webpack:///src/*": "${webRoot}/*"
// }
}
I build my app through npm run build or npm run devbuild which, by my knowlegde, 'compiles' the .vue components into Javascript files. And then start the app with either npm start or nodemon index.js.
Package.json
"scripts": {
<...>
"build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
"devbuild": "cross-env NODE_ENV=development webpack --progress --hide-modules",
<...>
},
Have you ever tried add a new script with nodemon? Something like this:
"newScript": "nodemon -L -e ts,json --watch . --exec \"npm run build
|| npm run devbuild\""
-L = Though this should be a last resort as it will poll every file it can find.
-e = By default, nodemon looks for files with the .js, .mjs, .coffee, .litcoffee, and .json extensions. If you use the --exec option and monitor app.py nodemon will monitor files with the extension of .py. However, you can specify your own list with the -e (or --ext) switch like so: nodemon -e js,jade
--watch . = To watch all the changes on the path, in this case all the code on the current path.
(I got all of this information from the documentation.
then, run the command:
npm run newScript

How can I pass parameters from a npm script to another?

I am trying to pass the parameters from a npm script to another (that is called by the first one), but I absolutely can't figure out how to do it.
Here is the case, I have the following scripts section in my package.json :
{
"scripts": {
"one": "npm run two && npm run three",
"two": "gulp build",
"three": "another random command"
}
}
I'm running script one like this : npm run one -- --arg=value. But I want to dynamically pass down arg to the script two.
To sum up, what I want is :
I type npm run one -- --arg=value
It runs npm run two -- --arg=value && npm run three
Which results in running gulp build --arg=value, followed by the other random command
Does anybody have an idea ? Thank you very much.
All three methods below work with npm run one -- --arg=value.
1. Using pre & post scripts
You can run the second script directly and define the third one as a post script.
{
"scripts": {
"one": "npm run two --",
"postone": "npm run three",
"two": "gulp build",
"three": "another random command"
}
2. Using npm-run-all
Pass argument placeholders to individual scripts.
"scripts": {
"one": "run-s 'two -- {#}' three --",
"postone": "npm run three",
"two": "gulp build",
"three": "another random command"
}
3. Using concurrently
Change the first script to run everything with concurrently, instructing that the second script should get pass through arguments.
{
"scripts": {
"one": "concurrently -P 'npm run two -- {#} && npm run three' --",
"two": "gulp build",
"three": "another random command"
}
}
Since we are passing only one command to concurrently, there is no concurrency.

Passing argument to prestart npm-script

package.json
{
..
"scripts": {
"prestart": "gulp",
"start": "webpack-dev-server"
},
..
}
i need to pass appname to both gulp as well as webpack-dev-server.
When i am doing npm start -- --app=todo
the argument --app=todo is only available to webpack-dev-server not in gulp.
Any solution to pass argument to both the task.
I tried "scripts" : {"start" : "gulp & webpack-dev-server"} as well.
I had the same question and came upon this conversation. It appears that this is deliberately not possible.