Chrome debugger doesn't work on typescript files

your ts code is converted to js during compile time and eventually it is javascript file which get loaded in web browser. your browser doesn't know about typescript.

ts ---> js (es5).

When debugger runs it is going to run respective compiled js file. if there is any error it points to js file and you are mapped to ts file line-number (where error occured) with help of .d.ts internally.

if you want to debug, you can use karma test runner or use visual studio code which exclusively provides debug option.

If you want to be able to use tools on TypeScript files, you'll generally need to generate map files at the same time you compile your TypeScript.

Map files contains information about how to link the original .ts file with the compiled .js file. Tools like debuggers will often need these files to be able to act on .ts files.

Someone explained it here.

Also, if you don't want to generate an extra file for these mappings, the TypeScript compiler lets you add these information directly at the end of the compiled files, using the --inlineSourceMap.

Here, I think that Chrome doesn't find the map files.