What is a TypeScript map file?

Question

I saw .map files for TypeScript. I want to know what these files are for. Do they contain links to other files specified in the .ts file?

Answer 1

.map files are source map files that allow you to display tools between the emitted JavaScript code and the TypeScript source files that created it. Many debuggers (such as Visual Studio or Chrome dev tools) can use these files so that you can debug a TypeScript file instead of a JavaScript file.

This is the same source map format that is created by some minifiers and other compiled JS languages ​​such as CoffeeScript .

Answer 2

The source map is basically what it says, a map from one language to another, so the debugger can run JavaScript code, but show you which actually generated it.

Read the Source Map Anatomy section here:

https://www.html5rocks.com/en/tutorials/developertools/sourcemaps/

For practical debugging purposes

What the source map allows, set a breakpoint in the TypeScript file, and then debug the code. This can be done in Chrome and Firefox. Entering a breakpoint can actually happen in the converted JavaScript (ie, the Associated "js" file) - this is what you will see when using the Chrome developer tools. At the time of this writing, the Firefox debugger might have broken the actual TypeScript code, but Chrome cannot - see the link below.

http://www.gamefromscratch.com/post/2014/05/27/TypeScript-debugging-in-Visual-Studio-with-IE-Chrome-and-Firefox-using-Source-Maps.aspx )

(this also shows how Visual Studio can be configured to create the source map)