Now that we have our minified output and the mapping file we can deploy and .map as part of our web application. Also bear in mind with tools like Uglify you may be combining multiple source files into a single minified output and so the sources section can contain multiple entries.
Its not uncommon for your map file to rival the size of your original source files. In practice the names and mappings sections are likely to be quite substantial. If you used the –source-map-root option with Uglify earlier the sources would be adjusted based on the path specified with that option.
Javascript minify source map how to#
File can be an absolute or relative URI describing how to reach the file and likewise the filenames in the sources array can be absolute or relative paths. You can see the file contains the name of the file it should be related to (), the source files which it maps to (source.js) and set of names and mappings which describe the relationships between file and sources.
Javascript minify source map install#
To install it you will need Node.js installed (even if you’re not a Node dev, this is pretty easy), you can then run: To get started you will need a tool which can help produce a source map as part of producing a minified version of your JavaScript. We personally use UglifyJS and find it to be a most excellent tool. For handling translation of our minified JavaScript we want to produce a JavaScript source map. We can use source maps for our minified JavaScript, our CoffeeScript output, our Less output and our Sass output! If you are interested in the technical details on how the mapping works and what the source map file contains you can read up on the revision 3 proposal document. Source Maps are a JSON based mapping format which can be used by any processed file to create a mapping relationship between source and processed output. It’s standard practice to minify your JavaScript for production deployments to improve performance for end users but this has the unfortunate side effect of making debugging production issues quite difficult and line 1 quickly becomes a very popular number. Thankfully in more recent times we can leverage a JavaScript source map file to map between a minified version of our JavaScript and the un-minified source. Getting started with JavaScript Source Maps By Jeremy Boyd | Posted | 6 min.
0 kommentar(er)
