In this tutorial we will see how to pass arguments to a command when combining npm scripts.

Project setup

Let’s assume we have the current script defined in our npm scripts:

1
2
3
"scripts": {
"stylus": "stylus src/stylus/site.styl --out dist/"
},

Watching for changes

Now let’s say we want to create a new task that will not only compile our stylus files to css but also watch for changes and recompile when necessary.

Using the command line this can be done with the -w flag:

1
stylus src/stylus/site.styl -w

We now want to create a new script that watches for stylus changes. We can do:

1
2
3
4
"scripts": {
"stylus": "stylus src/stylus/site.styl --out dist/",
"watch:stylus": "stylus src/stylus/site.styl --out dist/ -w"
},

See anything ugly ?

Reusing existing code

In order to avoid duplicated code, we want to reuse our first command and add the -w flag.

The general syntax is

1
npm run [command] [-- <args>]

With our example it would be:

1
2
3
4
"scripts": {
"stylus": "stylus src/stylus/site.styl --out dist/",
"watch:stylus": "npm run stylus -- -w"
},

Note the -- in between the initial command and the additional arguments.