用于ng build --watch的VSCode task.json

Question

我找不到针对角度cli“ ng build --watch” commapnd的有效Visual Studio Code task.json定义。有人可以提供经过良好测试的定义吗？

要重现，请尝试出现错误，然后修复它。该错误将保留在“问题”标签中

还需要“ ng lint”的任务定义。

这就是我所拥有的，并且运行不正常。

{
"version": "2.0.0",
"tasks": [
    {
        "label": "ngBuildWatch",
        "type": "shell",
        "command": "ng",
        "args": [
            "build",
            "--watch"
        ],
        "isBackground": true,
        "problemMatcher": {
            "owner": "angular",
            "severity": "error",
            "fileLocation": "relative",
            "background": {
                "activeOnStart": true,
                "beginsPattern": {
                    "regexp": "^\\s*(?:message TS6032:|\\d{1,2}:\\d{1,2}:\\d{1,2} (?:AM|PM) -) File change detected\\. Starting incremental compilation\\.\\.\\./"
                },
                "endsPattern": "/^\\s*(?:message TS6042:|\\d{1,2}:\\d{1,2}:\\d{1,2} (?:AM|PM) -) Compilation complete\\. Watching for file changes\\./ "
            },
            "pattern": [
                {
                    "regexp": "ERROR in (.*)\\(",
                    "file": 1
                },
                {
                    "regexp": "\\((\\d+),(\\d+)\\):(.*)",
                    "line": 1,
                    "column": 2,
                    "message": 3
                }
            ]
        }
    }
]

}

Answer 1

这是我对 ng build 的tasks.json 定义（对 Typescript 扩展定义的一些修改），我想你也可以将它改编为 ng build --watch ：

{
    "label": "show all TS errors: ng build",
    "type": "npm",
    "script": "build",
    "problemMatcher": {
        "owner": "typescript",
        "source": "ts",
        "applyTo": "closedDocuments",
        "pattern": {
            "regexp": "^ERROR in ([^\\s].*)[\\(:](\\d+)[,:](\\d+)(?:\\):\\s+|\\s+-\\s+)(error|warning|info)\\s+(TS\\d+)\\s*:\\s*(.*)$",
            "file": 1,
            "line": 2,
            "column": 3,
            "severity": 4,
            "code": 5,
            "message": 6
        },
        "fileLocation": "relative"
    }
}

对于 ng lint：

{
    "label": "show all TSLint errors: ng lint",
    "type": "npm",
    "script": "lint",
    "problemMatcher": "$tslint5"
},

包.json：

"scripts": {
    "ng": "ng",
    "build": "ng build",
    "lint": "ng lint",
},

$tslint5ProblemMatcher 包含在扩展TypeScript TSLint Plugin和TSLint中。我推荐第一个，因为它是第二个扩展的重写版本，支持语言服务插件。您可以在他们的页面上找到安装说明。