Question

如何在仍然能够调试代码的同时将打字稿代码编译到不同的文件夹？

假设我想在文件console.log中的第一个myapp.ts设置断点：

class HelloTS {
    public static main(): number {
        console.log('Hello TS');

        console.log("about to exit now")
        return 0;
    }
}

HelloTS.main();

以及以下tsconfig.json：

{
    "compilerOptions": {
        "target": "es5",
        "module": "commonjs",
        "sourceMap": true
    }
}

只要myapp.ts，myapp.js和myapp.js.map位于同一文件夹中，

Breakpointing就可以正常工作。

但是，当我为源（src/）和输出（dist/）创建单独的文件夹时，断点不起作用，也不会抛出任何错误。

我有以下配置，它成功编译，但无法提供调试。

.vscode/tasks.json：

{
    "version": "0.1.0",
    "command": "tsc",
    "isShellCommand": true,
    "args": [
        "-p", ".", 
        "--rootDir", "src/", 
        "--outDir", "dist/"    
    ],
    "showOutput": "silent",
    "echoCommand": true,
    "problemMatcher": "$tsc"
}

.vscode/launch.json：

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Launch",
            "type": "node",
            "request": "launch",
            "program": "${workspaceRoot}/src/myapp.ts",
            "stopOnEntry": false,
            "args": [],
            "cwd": "${workspaceRoot}",
            "preLaunchTask": null,
            "runtimeExecutable": null,
            "runtimeArgs": [
                "--nolazy"
            ],
            "env": {
                "NODE_ENV": "development"
            },
            "console": "internalConsole",
            "sourceMaps": true,
            "outFiles": [
                "**/*.js",
                "**/*.js.map"
            ]
        },
        {
            "name": "Attach",
            "type": "node",
            "request": "attach",
            "port": 5858,
            "address": "localhost",
            "restart": false,
            "sourceMaps": true,
            "outFiles": [],
            "localRoot": "${workspaceRoot}",
            "remoteRoot": null
        },
        {
            "name": "Attach to Process",
            "type": "node",
            "request": "attach",
            "processId": "${command.PickProcess}",
            "port": 5858,
            "sourceMaps": true,
            "outFiles": []
        }
    ]
}

Answer 1

我认为outFiles中的launch.json属性应为：

{
  ...

  "outFiles": [ "${workspaceRoot}/dist/**/*" ]

  ...
},

使用Visual Studio Code和单独的输出文件夹调试Typescript

1 个答案: