如何通过NPM脚本打开VS Code内置PowerShell窗口运行多个脚本？

原脚本执行异常原因 #

• && 为串行执行逻辑，必须等待前一条命令执行完成并退出才会触发下一条，而ng serve是常驻的开发服务进程，不会主动退出，因此执行到第一条就会卡住
• 单个&在PowerShell中是调用操作符，不是类Unix系统的后台运行标识，无法实现并行执行效果
• 直接调用start powershell会唤起系统独立终端，无法复用VS Code内置终端能力

适配方案（支持一键唤起3个独立VS Code内置终端） #

步骤1：配置VS Code任务 #

在项目根目录新建.vscode文件夹（已存在则跳过），在文件夹内新建tasks.json文件，写入以下配置：

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "启动平台服务",
      "type": "shell",
      "command": "npm run start-jsonserver:platform",
      "presentation": {
        "panel": "new",
        "reveal": "always"
      }
    },
    {
      "label": "启动核心插件服务",
      "type": "shell",
      "command": "npm run start:corePlugins",
      "presentation": {
        "panel": "new",
        "reveal": "always"
      }
    },
    {
      "label": "启动JsonServer服务",
      "type": "shell",
      "command": "npm run start:jsonserver",
      "presentation": {
        "panel": "new",
        "reveal": "always"
      }
    },
    {
      "label": "一键启动全部JSON环境服务",
      "dependsOn": ["启动平台服务", "启动核心插件服务", "启动JsonServer服务"],
      "dependsOrder": "parallel",
      "group": "build"
    }
  ]
}

步骤2：使用方式 #

方式1：直接通过VS Code命令面板运行

按Ctrl+Shift+P（Mac系统为Cmd+Shift+P）呼出命令面板，输入「运行任务」，选择「一键启动全部JSON环境服务」，即可自动生成3个独立的内置终端分别运行对应脚本，日志互不干扰。

方式2：通过NPM脚本触发（符合原使用习惯）

1. 先确认VS Code的code命令已加入系统环境变量：呼出命令面板，输入「安装code命令到PATH」执行即可
2. 在package.json的scripts中添加如下配置：

"start:allJsonEnvironment": "code --task \"一键启动全部JSON环境服务\""

后续直接在VS Code内置终端执行npm run start:allJsonEnvironment，就会自动唤起3个独立内置终端运行对应脚本。

内容的提问来源于stack exchange，提问作者L.Kaisi