在停止调试时终止 VS Code 中的 ng 服务任务

Question

我有一个 Angular 项目，目前正在通过 chrome 调试器在 vs code 内进行调试。我的launch.json用途"preLaunchTask": "serve"是，服务定义为tasks.json，"ng serve"以便我首先执行“ng服务”，并且在调试器打开浏览器以点击http://localhost:4200之前，服务器已准备就绪。

一切正常。但是，当我停止调试时，"ng serve"任务仍然按预期运行，并且每次都必须手动终止该任务。

我尝试使用"postDebugTask"inlaunch.json但不太幸运，因为 vs code 会抱怨启动新任务（postDebug），直到另一个正在运行的任务（preLaunch）未终止。有人可以帮忙吗？

Answer 1

研究了一段时间后，似乎没有任何干净的方法可以终止 VS Code 中作为preBuildTask. 这是一个构建任务，调试任务本身似乎与它是分开的。由于调试 PID 本身是针对 Chrome 的，因此两者之间存在奇怪的分离。

那么，我们来暴力破解吧。

首先，我们需要将初始ng serve运行作为子进程，这样另一个任务就不会抱怨第一个任务占用终端。这项任务对我有用：

{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "serve",
            "command": "ng serve",
            "isBackground": true,
            "type": "shell",
            "presentation": {
                "reveal": "always"
            },
            "problemMatcher": {
                "fileLocation": "relative",
                "background": {
                }
            }
        }
    ]
}

注意isBackground属性。这将在它们自己的 shell 中生成任何未来的任务。presentation这样reveal: always我们就可以看到 CLI 输出。我们可以通过 中的调试过程来想象并捕获 CLI 问题problemMatcher，但现在让我们忘记它。

现在，让我们来做一个kill任务。让我们通过操作系统来完成此操作，而不是通过 VS Code 来查找初始生成的任务。现在，这高度依赖于您使用的操作系统和shell（可以通过属性为每个任务配置 shell shell）。

我们需要找到shell的PIDng serve并将其发送到天空中的大计算机。我们可以查找占用正在服务的本地主机端口的 PID，我假设默认情况下是 4200。

CMD命令示例：

for /F "tokens=1,2,3,4,5" %A in ('"netstat -a -n -o | find 4200""') DO ('"Taskill /PID %E /F"')

示例bash/terminal命令（更简单，像往常一样）：

[sudo] lsof -ti:4200 | xargs kill

然后只需kill使用命令创建一个任务并将其添加到postDebugTask：

    {
        "label": "kill",
        "command": "lsof -ti:4200 | xargs kill",
        "type": "shell",
    }

如果您遇到访问权限问题，您可以通过以管理员身份运行 VS Code 或提供您已拥有管理员权限的 .exe 的路径来修复它。同样，取决于您的 shell 和操作系统。