使用npm运行多个并行脚本的分步指南。全局安装npm-run-all包

npm i -g npm-run-all

现在在package.json所在的项目中安装并保存此包

npm i npm-run-all --save-dev

现在以这种方式修改package.json文件中的脚本

"scripts": {
    "server": "live-server index.html",
    "watch": "node-sass scss/style.scss --watch",
    "all": "npm-run-all --parallel server watch"
},

现在运行此命令

npm run all

有关此包的详细信息，请参见给定的链接npm全部运行

如果您使用的是类似UNIX的环境，请使用&作为分隔符：

"dev": "npm run start-watch & npm run wp-server"

否则，如果您对跨平台解决方案感兴趣，可以使用npm-run-all模块：

"dev": "npm-run-all --parallel start-watch wp-server"

由于您可能需要向该脚本中添加越来越多的内容，因此它将变得混乱且难以使用。如果您需要检查一些条件和使用的变量，该怎么办？所以我建议您看看允许使用js创建脚本的google/zx。

简单用法：

安装zx:npm i-g zx添加package.json命令（可选，您可以将所有内容移动到脚本中）：

  "scripts": {
    "dev": "zx ./scripts/dev.mjs", // run script
    "build:dev": "tsc -w", // compile in watch mode
    "build": "tsc", // compile
    "start": "node dist/index.js", // run
    "start:dev": "nodemon dist/index.js", // run in watch mode
  },

创建dev.mjs脚本文件：

#!/usr/bin/env zx

await $`yarn build`; // prebuild if dist is empty
await Promise.all([$`yarn start:dev`, $`yarn build:dev`]); // run in parallel

现在，每当您想启动开发服务器时，只需运行yarn dev或npm run dev。

它将首先编译ts->js，然后在监视模式下并行运行typescrpt编译器和服务器。当您更改ts文件时->它将由tsc重新编译->nodemon将重新启动服务器。

高级编程使用

加载env变量，在监视模式下编译ts，然后从dist-on-changes（dev.mjs）重新运行服务器：

#!/usr/bin/env zx
import nodemon from "nodemon";
import dotenv from "dotenv";
import path from "path";
import { fileURLToPath } from "url";

// load env variables
loadEnvVariables("../env/.env");

await Promise.all([
  // compile in watch mode (will recompile on changes in .ts files)
  $`tsc -w`,
  // wait for tsc to compile for first time and rerun server on any changes (tsc emited .js files)
  sleep(4000).then(() =>
    nodemon({
      script: "dist/index.js",
    })
  ),
]);

function sleep(ms) {
  return new Promise((resolve) => {
    setTimeout(resolve, ms);
  });
}

function getDirname() {
  return path.dirname(fileURLToPath(import.meta.url));
}

function loadEnvVariables(relativePath) {
  const { error, parsed } = dotenv.config({
    path: path.join(getDirname(), relativePath),
  });

  if (error) {
    throw error;
  }

  return parsed;
}

使用concurrent可与共享输出流并行运行命令。为了便于区分哪个输出来自哪个进程，请使用缩短的命令格式，例如npm:wp-server。这将导致同时在每个输出行前面加上命令名。

在package.json中，脚本部分如下所示：

 "scripts": {
    "start": "concurrently \"npm:start-watch\" \"npm:wp-server\"",
    "start-watch": "nodemon run-babel index.js",
    "wp-server": "webpack-dev-server"
  }

在Linux上只使用shell脚本。

"scripts": {
  "cmd": "{ trap 'trap \" \" TERM; kill 0; wait' INT TERM; } && blocking1 & blocking2 & wait"
}

npm运行命令然后^C会杀死孩子，等待干净的出口。

npm-run-all --parallel task1 task2

编辑：

您需要事先安装npm runall。还请检查此页面以了解其他使用情况。