npm 包 concurrently 使用教程

什么是 concurrently？

concurrently 是一个 Node.js 的命令行工具，可以让你在同一终端窗口中同时运行多个命令。在前端开发中，我们通常需要同时启动多个服务，例如前端应用、后端服务器和数据库等。使用 concurrently 可以让这些服务在同一终端窗口中异步运行。

安装 concurrently

concurrently 可以通过 npm 安装：

npm install concurrently --save-dev

使用 concurrently

运行时，我们需要将要同时运行的命令用空格分隔，并将它们用引号括起来。例如，在 package.json 文件中添加以下脚本：

{
  "scripts": {
    "start": "concurrently \"npm run start:client\" \"npm run start:server\""
    "start:client": "webpack-dev-server",
    "start:server": "nodemon server.js"
  }
}

在上面的示例中，我们定义了一个名为 start 的脚本，它会同时启动两个命令：npm run start:client 和 npm run start:server。其中，start:client 用于启动 webpack-dev-server，start:server 用于启动 nodemon 监听 server.js 文件的变化。

然后，我们只需在终端中运行以下命令即可启动这两个进程：

npm run start

当我们想停止所有进程时，只需要在终端中按下 Ctrl + C 即可。

高级选项

concurrently 提供了很多高级选项，可以满足各种需求。例如，我们可以使用 --kill-others-all 选项在命令失败时直接退出所有进程，或者使用 --names 选项为每个进程自定义名称：

{
  "scripts": {
    "start": "concurrently --kill-others-all --names \"client,server\" \"npm run start:client\" \"npm run start:server\""
  }
}

在上面的示例中，我们使用了 --kill-others-all 和 --names 选项。--kill-others-all 表示当某个进程失败时，同时杀死其他进程并退出。--names 选项用于为每个进程自定义名称，这样可以更清晰地区分不同的进程。

结论

使用 concurrently 可以让我们方便地同时启动多个进程，并可以定制各种高级选项来满足我们的需求。在前端开发中，这一工具尤为有用。希望本文能够帮助你更好地理解和使用 concurrently。

完整示例代码：

{
  "scripts": {
    "start": "concurrently --kill-others-all --names \"client,server\" \"npm run start:client\" \"npm run start:server\"",
    "start:client": "webpack-dev-server",
    "start:server": "nodemon server.js"
  }
}

参考资料：Concurrently - npm

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/50503