Cant debug TypeScript in Visual Studio Code

Question

I'm having the same Problem, as resolved in this answer: Unable to debug Typescript in VSCode

Unfortunately this doesn't seem to work for me. Any help is appreciated.

My folder structure:

This is my tsconfig.json

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    //"declaration": true,

    "inlineSourceMap": false,
    "lib": [
      "es6"
    ],
    "outDir": "./dist",
    "moduleResolution": "node",
    "sourceMap": true,
    "mapRoot": "./maps"
  },
  "include": [
    "src/**/*.ts"
  ],
  "exclude": [
    "node_modules"
  ]
}

This is my launch.json:

{
    // Use IntelliSense to learn about possible Node.js debug attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "program": "${workspaceRoot}/src/index.ts",
            "cwd": "${workspaceRoot}",
            "outFiles": [
                "${workspaceRoot}/dist/**/*.js"
            ]           
        },
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "program": "${file}",
            "outFiles": [
                "${workspaceRoot}/dist/**/*.js"
            ]
        }
    ]
}

Answer 1

Finally found the answer by accident ...

The problem was not in the launch.json or tsconfig.json. It was how I generated the source maps. The compiler always showed:

error TS5052: Option 'mapRoot' cannot be specified without specifying option 'sourceMap'.

But the sourceMap option was configured in the tsconfig.json. I had a look in the documentation of gulp-typescript and tried the "integrated" solution of generating the sourceMaps there. So it now looks like this:

gulp.task('compile', () => {
    let tsResults = tsProject.src()
        .pipe(sourcemaps.init())
        .pipe(tsProject());

    return tsResults.js
        .pipe(sourcemaps.write('../maps'))
        .pipe(gulp.dest('dist'));
});

Before, there was a seperate task for generating source maps. I guess there was a problem with this:

gulp.task('sourcemaps', () => {
    gulp.src('dist/**/*.js')
        .pipe(sourcemaps.init())
        .pipe(sourcemaps.write('../maps'))
        .pipe(gulp.dest('dist'));
});