用于 Angular CLI 构建/服务/测试命令的 VS 代码任务问题匹配器

Question

我正在尝试为标准 Angular CLI 命令(如ng build、ng serveng test(配置 VS 代码任务。目的是在运行 CLI 命令时获取问题列表，我可以轻松遍历。目前，我直接从VS Code终端运行这些命令，但有时很难导航到错误，因为并非终端中的所有源链接都是可单击的。无论如何，VS Code 问题列表会更方便。我想知道仍然没有一个标准的匹配器，尽管 Angular 如此受欢迎，还是我错过了一个？

我试图创建一个自定义匹配器，但它看起来比我预期的要难。Angular CLI 输出打字稿错误以及 html 和 scss 错误，因此任务应包含多个匹配器。我无法使用标准$tsc匹配器，因为 Angular CLI 输出与 TS 编译器输出略有不同 - 第一个错误以ERROR in开头，并且$tsc匹配器无法识别此错误。

例如，下面是ng test任务，但它没有按预期工作：

1. 当我通过按导航到第一个错误时F8，有时会清除问题列表。我猜匹配器与在打开的文件上检测到错误的 tsserver 冲突。
2. 有时匹配器会错过一些错误。

// .vscode/tasks.json
{
"version": "2.0.0",
"tasks": [{
"label": "test",
"type": "shell",
"command": "ng test",
"problemMatcher": [{
"base": "$tsc",
"fileLocation": [
"relative",
"${workspaceRoot}/src"
],
"pattern":[{
"kind": "ts",
"regexp": "^(?:ERROR in )?(.*):(\d+):(\d+) - (error|warning|info) TS(.*): (.*)$",
"file": 1,
"line": 2,
"column": 3,
"severity": 4,
"code": 5,
"message": 6
}]
}],
"group": {
"kind": "test",
"isDefault": true
}
}]
}

Answer 1

我在 Angular 11 中遇到了同样的问题。 我在这里找到了 vscode 源代码中的标准$tsc问题匹配器 我还在开头添加了错误一词：

"problemMatcher": [
{
"base": "$tsc",
"pattern": {
"regexp": "^(Error: )?([^\s].*)[\(:](\d+)[,:](\d+)(?:\):\s+|\s+-\s+)(error|warning|info)\s+TS(\d+)\s*:\s*(.*)$",
"file": 2,
"line": 3,
"column": 4,
"severity": 5,
"code": 6,
"message": 7
}
}
],

我也在这里写了这个问题