Question

我注意到如果您正在使用Node Package Manager，通常可以让package.json有这样的内容：

(dependencies and devDependencies omitted)..
"scripts": {
    "start": "concurrently \"npm run tscwatch\" \"npm run lite\" ",
    "tsc": "tsc",
    "tscwatch": "tsc -w",
    "lite": "lite-server",
    "typings": "typings",
    "postinstall": "typings install"
  }

然后，您只需到达您所在文件夹的级别并输入

npm install

然后

npm start

Lite服务器托管您的应用程序和打字稿编译为javascript。前提是您已运行等效的typescript配置并具有有效的tsconfig.json。除此之外，我想要调试Typescript，并在墙壁工作后进入墙壁。我知道你可以添加＆quot; launch.json＆＃39; VS Code用来执行许多类型的启动程序的能力。其中很多都适用于我在网上找到的简单应用程序，但不是Angular，因为我正在使用它。但是当我尝试在launch.json中执行NPM Start时：

 {
        "type": "node",
        "request": "launch",
        "name": "Launch via NPM ProAngular Example",
        "runtimeExecutable": "npm",
        "args": ["${relativeFile}"],
        "runtimeArgs": [
            "start"
        ]
    }

它将运行但后来尝试打开Visual Studio Professional（可能不是其他人的情况）然后出现如下错误：＆＃34;无法连接到运行时进程，10000毫秒后超时 - （原因：无法连接到目标：连接ECONNREFUSED 127.0.0.1:(port））。我已尝试过NPM的其他配置用于发布和其他事情。我只是想在使用Angular时调试Typescript，这在VS Code中可能吗？

Answer 1

按照VSCode中的以下说明操作：

1-下载latest release of VS Code并安装Chrome debugger

2-确保Chrome至少是版本59（请参阅issue）

3-使用angular-cli

创建Angular应用

4-创建launch.jsonfile以配置VS Code调试器并将其放在根文件夹中的.vscode内。

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "chrome",
      "request": "launch",
      "name": "Launch Chrome with ng serve",
      "url": "http://localhost:4200/#",
      "webRoot": "${workspaceRoot}"
    },
    {
      "type": "chrome",
      "request": "launch",
      "name": "Launch Chrome with ng test",
      "url": "http://localhost:9876/debug.html",
      "webRoot": "${workspaceRoot}"
    }
  ]
}

通过在您最喜爱的终端中运行ng serve来启动Angular应用。
按F5或转到调试部分选择Launch Chrome with ng serve，然后单击绿色调试图标，在VS Code中开始调试。

如何成功调试Visual Studio Code中的typescript？

1 个答案: