CODEWITHSUNDEEP
node.jstypescriptdebuggingvisual-studio-codetsc
Lion
Lion

Reputation: 17879

Debugging doesn't work in Visual Studio Code 1.19.3

I want to use Visual Studio for developing an Node.js application with Typescript and simply want the normal debug behavior of any modern IDE: Debug code, set breakpoints, look into vars etc. Following the official documentation guide, I get an error when running the task: The npm task typescript didn't contribute a task for the following configuration.

So instead I invoke a custom npm script in the tasks.json file:

launch.json

"version": "0.2.0",
"configurations": [
{
    "type": "node",
    "request": "attach",
    "name": "Attach",
    "port": 9229,
    "preLaunchTask": "typescript"
}
]

task.json

"tasks": [
    {
        "type": "shell",
        "label": "typescript",
        "command": "cd server; npm run build:live"
    },
]

package.json

  "scripts": {
    "build:live": "nodemon --inspect --exec ./node_modules/.bin/ts-node -- ./index.ts"
  }

Now the app is comping and starting (also with live reloading) fine. But NO debugging works, no breakpoint was reached. Is it really that hard to debug Typescript in VS Code?

I'm using the latest

Upvotes: 1

Views: 1287

Answers (1)

user6643481
user6643481

Reputation:

Live debugging seems to be a pain on Typescript in VS Code. I could only make regular debugging working in a similar way to the full Visual Studio:

launch.json

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "program": "${workspaceRoot}/index.ts",
            "outFiles": [
                "${workspaceRoot}/dist/**/*.js"
            ],
            "sourceMaps": true,
            "stopOnEntry": false,
            "cwd": "${workspaceRoot}",
            "env": {
                "NODE_ENV": "development"
            },
            "console": "integratedTerminal",
            "internalConsoleOptions": "openOnFirstSessionStart",
            "preLaunchTask": "compile",
            "name": "DEBUG"
        }
    ]
}

tasks.json

{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "compile",
            "type": "typescript",
            "tsconfig": "tsconfig.json",
            "problemMatcher": [
                "$tsc"
            ],
            "group": {
                "kind": "build",
                "isDefault": true
            }
        }
    ]
}

Please note that you've to set "sourceMap": "true" in tsconfig.json. When not, an error occurs that corresponding source maps aren't found. This is cause NodeJS isn't able to compile TS. Compiling is done by the TypeScript compiler tscbefore. For debugging purpose (e.g. reach breakpoints) the source maps can map the compiled js to the ts source file here.

Upvotes: 0

Related Questions