Visual studio code 如何实现'au run--watch'task+;调试

Visual studio code 如何实现'au run--watch'task+;调试,visual-studio-code,aurelia,Visual Studio Code,Aurelia,我试图在VS代码中为基于Aurelia CLI的应用程序实现“F5”调试。Aurelia CLI构建在Gulp任务之上。我想设置一个运行au run--watch的任务,并在按“F5”进行调试时启动该任务(“启动Chrome”选项) 为au run--watch命令创建基本任务非常简单 { // See https://go.microsoft.com/fwlink/?LinkId=733558 // for the documentation about the tasks.json

我试图在VS代码中为基于Aurelia CLI的应用程序实现“F5”调试。Aurelia CLI构建在Gulp任务之上。我想设置一个运行
au run--watch
的任务,并在按“F5”进行调试时启动该任务(“启动Chrome”选项)

au run--watch
命令创建基本任务非常简单

{
  // See https://go.microsoft.com/fwlink/?LinkId=733558
  // for the documentation about the tasks.json format
  "version": "0.1.0",
  "command": "au",
  "isShellCommand": true,
  "tasks": [
    {
      "taskName": "watch",
      "suppressTaskName": true,
      "args": [
        "run",
        "--watch"
      ],
      "isBuildCommand": false,
      "isBackground": true
      }
  ]
}
然后,我可以在按下F5时启动此任务,方法是将其添加到“针对本地主机启动Chrome”调试配置中:

    {
        "type": "chrome",
        "request": "launch",
        "name": "Launch Chrome against localhost",
        "url": "http://localhost:9000",
        "webRoot": "${workspaceRoot}",
        "preLaunchTask": "watch"
    }
我看到的问题是,由于此任务是一个“监视”任务,无法完成,因此代码从不启动Chrome选项卡或启动调试会话

我已经尝试在我的任务配置中添加一个“problemMatcher”,但坦率地说,这个特性的文档有点少。我得到的错误输出似乎与JSON模式所说的不匹配。希望有人能帮我。这是我当前的非工作任务配置。当我说非工作时,我的意思是任务成功运行,但是VS代码没有注意到任务的监视部分已经开始

{
  // See https://go.microsoft.com/fwlink/?LinkId=733558
  // for the documentation about the tasks.json format
  "version": "0.1.0",
  "command": "au",
  "isShellCommand": true,
  "tasks": [
    {
      "taskName": "watch",
      "suppressTaskName": true,
      "args": [
        "run",
        "--watch"
      ],
      "isBuildCommand": false,
      "isBackground": true,
      "problemMatcher": {
        "owner": "au",
        "severity": "info",
        "fileLocation": [
          "relative",
          "${workspaceRoot}"
        ],
        "pattern": {
          "regexp": "^BrowserSync Available At: http://localhost:3001$",
          "file": 1
        },
        "watching": {
          "activeOnStart": true,
          "beginsPattern": "^File Changed: (.*)", 
          "endsPattern": "^Finished 'reload'"
        }
      }
    }
  ]
}
作为参考,当我运行此任务时,以下是命令的输出:

Starting 'readProjectConfiguration'...
Finished 'readProjectConfiguration'
Starting 'processMarkup'...
Starting 'processCSS'...
Starting 'copyFiles'...
Starting 'configureEnvironment'...
Finished 'copyFiles'
Finished 'processCSS'
Finished 'processMarkup'
Finished 'configureEnvironment'
Starting 'buildJavaScript'...
Finished 'buildJavaScript'
Starting 'writeBundles'...
Tracing app...
Tracing environment...
Tracing main...
Tracing resources/index...
Tracing app...
Tracing aurelia-binding...
Tracing aurelia-bootstrapper...
Tracing aurelia-dependency-injection...
Tracing aurelia-event-aggregator...
Tracing aurelia-framework...
Tracing aurelia-history...
Tracing aurelia-history-browser...
Tracing aurelia-loader-default...
Tracing aurelia-logging-console...
Tracing aurelia-pal-browser...
Tracing aurelia-route-recognizer...
Tracing aurelia-router...
Tracing aurelia-templating-binding...
Tracing text...
Tracing aurelia-templating-resources...
Tracing aurelia-templating-router...
Tracing aurelia-testing...
Writing app-bundle.js...
Writing vendor-bundle.js...
Finished 'writeBundles'
Application Available At: http://localhost:9000
BrowserSync Available At: http://localhost:3001
编辑和保存文件时,控制台输出中将添加以下内容:

File Changed: src\app.js
Starting 'readProjectConfiguration'...
Finished 'readProjectConfiguration'
Starting 'processMarkup'...
Starting 'processCSS'...
Starting 'copyFiles'...
Starting 'configureEnvironment'...
Finished 'copyFiles'
Finished 'processCSS'
Finished 'processMarkup'
Finished 'configureEnvironment'
Starting 'buildJavaScript'...
Finished 'buildJavaScript'
Starting 'writeBundles'...
Tracing app...
Writing app-bundle.js...
Finished 'writeBundles'
Starting 'reload'...
Finished 'reload'

我们知道这一点,相应的两个GitHub问题是:

我们计划从两个方面对此进行改进:

  • 即使启动前任务尚未完成,调试也会在超时后询问是否要开始调试
  • 任务框架将允许在任务本身上指定监视属性,而无需问题匹配器
本期6209包含了如何解决这个问题的步骤,您现在正走在正确的道路上:-)。应该有所不同的事情:

因为您不想匹配任何问题,所以请使用不匹配任何内容的regexp。比如:

"pattern": {
    "regexp": "__________"
}
更大的问题是,在第一次运行时,活动结束的信号与响应文件更改时的信号不同。因此,endsPattern必须同时匹配以下位置提供的
BrowserSync:http://localhost:3001
已完成“重新加载”
。因此,regexp类似于
/(?:BrowserSync可在:)|(?:Finished'reload')/
beginsPattern和
“activeOnStart”:true
是正确的


如果您仍然无法让它工作,请与我联系。

谢谢您的帮助。这有助于启动调试。现在我需要弄清楚为什么我的sourcemaps只有在我连接到Chrome时才起作用,而不是在我启动Chrome时起作用。但这是另一个问题。