Run a set of similar npm scripts with a wildcard

Elijah Manor
InstructorElijah Manor

Share this video with your friends

Send Tweet
Published 7 years ago
Updated 5 years ago

In this lesson we will run a set of scripts that are grouped together with a wildcard using the npm-run-all node package. Using this technique can help you simplify and organize your scripts.

Instructor: [00:01] Npm-run-all has a grouping feature that can be handy when you have scripts with a similar theme, like linting, for example. Let's rename the eslint script to lint:js. We'll also rename the stylelint script to lint:css.

[00:16] In our test script, instead of saying "eslint stylelint," we could just say "lint:." The : indicates that it will run any script that matches the pattern. In this case, it'll match lint:js and lint:css.

[00:31] We can save our code and open the terminal. When we run npm test, it'll run all of our linting and then all of our tests.

[00:39] Npm-run-all also supports the :** glob that'll match both subscripts and sub-subscripts. We could come down here and make a new script called lint:css:fix.

[00:51] We'll run the style-format command, recursively looking through our source directory, fixing any style issues that we might have violated. We can come up to our test script and change it from lint:* to lint:**, which will match lint:js, lint:css, and lint:css:fix.

[01:13] If we save our code and come back to the terminal, we'll need to npm install style-format and save it as a dev dependency. When we run our tests, it'll automatically lint both our JavaScript and our CSS and auto-fix both of them.

[01:28] One last thing that might be helpful is to create a plain lint script that will run all the linting subscripts. That way, we can easily run the lint script from the terminal.

[01:39] Now that we have that script, we can come up to our test script and change our npm-run-all to just lint and mocha. When we come to the terminal, we can just say, "npm run lint," which will kick off the linting for both the JavaScript and the styles and auto-fix both of them.