-2

I know it's not crucial to being a good coder, but I am curious if someone knows and could explain what is going on in .js.map files.

For example for this simple .ts file, 

import {bootstrap}    from 'angular2/platform/browser';
import {enableProdMode}    from 'angular2/core';
import {AppComponent} from './app.component';
import {HTTP_PROVIDERS} from 'angular2/http';
import {JSONP_PROVIDERS} from 'angular2/http';

enableProdMode();
bootstrap(AppComponent, [HTTP_PROVIDERS, JSONP_PROVIDERS]);

after compiling to js I get this .js.map file

{"version":3,"file":"main.js","sourceRoot":"","sources":["main.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;YAMA,qBAAc,EAAE,CAAC;YACjB,mBAAS,CAAC,4BAAY,EAAE,CAAC,qBAAc,EAAE,sBAAe,CAAC,CAAC,CAAC"}

Why?

CodyBugstein
  • 21,984
  • 61
  • 207
  • 363
  • 1
    have you tried searching for source maps online? You won't get a bit by bit explanation of the standard here. The proposal for version 3 can be found here. https://docs.google.com/document/d/1U1RGAehQwRypUTovF1KRlpiOFze0b-_2gc6fAH0KY0k/edit#heading=h.q4jwyo5vn7wd – toskv Apr 11 '16 at 20:36
  • They are for autocompletion from what I understand. – trenthaynes Apr 11 '16 at 20:49
  • @whipdancer no they are not. they map code generated in one language back to the language it was generated from in order to facilitate debugging in the language the developer wrote. the question is not about what they do, but rather about how they work, and that is either too broad for SO or at best the user would be pointed to an offsite resource, like the standards document. In both cases the question ought to be closed. :) – toskv Apr 11 '16 at 20:58
  • 1
    @toskv Thanks for giving the search terms to look up. I will do some research – CodyBugstein Apr 11 '16 at 21:01

1 Answers1

1

Why

These are sourcemap files. They allow you to debug the original code before it gets transpiled.

Resources

Checkout the sourcemap visualizer : https://sokra.github.io/source-map-visualization/

And more details on sourcemaps : http://www.html5rocks.com/en/tutorials/developertools/sourcemaps/

basarat
  • 261,912
  • 58
  • 460
  • 511