What are and what are .js.map files for?

Asked

Viewed 1,176 times

8

I downloaded the latest version of Boostrap (4.3.1 today). and I noticed that in the js folder, came several files with the end . map

js/bootstrap.bundle.js
js/bootstrap.bundle.js.map
js/bootstrap.bundle.min.js
js/bootstrap.bundle.min.js.map
js/bootstrap.js
js/bootstrap.js.map
js/bootstrap.min.js
js/bootstrap.min.js.map

What are these files for?

1 answer

8


From what little I actually know .map sane Sourcemaps (source map). Imagine that you have a development environment where you work on editable files, which in turn generate minified files when compiling. Debugging or maintaining a minified file is very bad and not very productive, so using a Sourcemap vc "link" to both versions of yours. JS not minified => minified, or . CSS (tb CSS compilers generate . map files). Gulp or Ruby for example when they compile from SCSS to CSS also generate a . map which is the link between the uncompiled . scss version and the . css after compilation.

What are Source Maps? A source map is a Json-based mapping format that creates a relationship between a minified file and its origins. When developing for production, in addition to minificar and combine Javascript files, you generate a source map that holds information about your original files. ... The source map file is a JSON file that defines a mapping between each generated CSS statement and the corresponding line in the source file

Source: https://developers.google.com/web/tools/setup/setup-preprocessors?hl=pt-br

That’s why when you work with Frameworks As Bootstrap is important you follow the organization of folders and files according to the documentation, in order to compile the paths not fail and be saved and found in the right places.

Here’s an article in Portuguese that you might be interested in https://blog.da2k.com.br/2015/02/21/sourcemaps-debugging/

Browser other questions tagged

You are not signed in. Login or sign up in order to post.