How to chain multiple commands in npm package.json scripts

Question

I am trying to create a script in my package.json file that will launch my nodemon app, then trigger a gulp sass watch

Currently, I can do this by running a npm launch which starts nodemon, then in a separate terminal window I can run gulp watch to trigger the sass watch from my gulp file.

I would like to create a single script command in package.json that will do both of these- is that possible?

package.json

  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "nodemon app.js",
    "launch": "nodemon app.js && gulp watch"
  },

gulpfile.js

const { src, dest, watch } = require("gulp");
const sass = require('gulp-sass')(require('node-sass'));

function generateCSS(cb) {
    src('./sass/**/*.scss')
        .pipe(sass().on('error', sass.logError))
        .pipe(dest('public/css'));
    cb();
}

function watchFiles(cb) {
    watch('sass/**/**.scss', generateCSS);
}

exports.css = generateCSS;
exports.watch = watchFiles;

edit: please see my answer below for what worked for me, inspired by the answer from @cmgchess

something like this? https://stackoverflow.com/questions/39172536/running-npm-scripts-sequentially — cmgchess, Aug 07 '22 at 17:52
no snap, that worked! according to that SO post '&&' executes the commands sequentially, while '&' executes the commands in parallel. So perhaps because nodemon launch but does not end, it never gets around to executing `gulp watch` when using `&&`. @cmgchess if you want to submit this as an answer I'll gladly confirm and upvote — kdub1312, Aug 08 '22 at 00:29
I think since you already found the Answer in the link it would be better if I do not repost. Anyway you are free to answer your own question with what worked for you — cmgchess, Aug 08 '22 at 03:39

score 1 · Answer 1 · answered Aug 07 '22 at 17:57

1

You should be able to use the npm-run-all package and its run-p command to execute multiple scripts side-by side:

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "nodemon app.js",
    "watch": "gulp watch",
    "launch": "run-p start watch"
},

Then you can just do:

npm launch

answered Aug 07 '22 at 17:57

JLRishe

99,490
19
131
169

@JKRishe I think this would certainly work but after reading @cmgchess comment above I wonder if using `&` is better suited for my use case, since my script is relatively simple. either way I'll keep this package under my cap, thank you- seems like it will be very useful for complex setups! – kdub1312 Aug 08 '22 at 00:34

score 0 · Answer 2 · answered Aug 07 '22 at 17:52

0

Just use the &&

package.json

"build": "npm run base && npm run utilities:global && npm run utilities:unstyled && npm run utilities:styled && npm run components && npm run merge:unstyled && npm run merge:styled && npm run rtl && npm run prejss && npm run themes && npm run full",

answered Aug 07 '22 at 17:52

Deyan Petrov

150
4

well I had that thought too and actually line 3 in my scripts object in my original post currently has the && in it, however it is not kicking off the gulp watch, only the nodemon service – kdub1312 Aug 08 '22 at 00:24

kdub1312 · Answer 3 · 2022-08-11T02:24:00.707

per @cmgchess answer in the comments, it turns out using a double ampersand runs the command sequentially. however, there is also the option to use a single ampersand, which will run them in parallel. In this case, this is what I needed:

"launch": "nodemon app.js & gulp watch"

edit: ok the first time I ran the launch it worked fine. however, subsequent launches crashed. I have it working again now over multiple launches, and what I had to do additionally is switch the order of the commands:

"launchreverse": "gulp watch & nodemon app.js"

How to chain multiple commands in npm package.json scripts

3 Answers3