CODEWITHSUNDEEP
javascript
NPC
NPC

Reputation: 1039

Revert JavaScript minification using source map

Is it possible to get a proper JavaScript source file if I have the minified file and its corresponding source map?

I know how to prettify JS code (line-breaks and indents), but I would like to get original function / variable names in the file, to be able to better understand the source code.

I would like to get the un-minified JS file to work with, instead of using it to debug in a browser.

PS It is probably somewhere right under my nose, but I didn't manage to find it so far. Sorry if this was already asked!

Upvotes: 12

Views: 9491

Answers (3)

whatistruth
whatistruth

Reputation: 149

I suggest using the Source Map Visualization tool online to view the original code with both js file and js soucemap file.

https://sokra.github.io/source-map-visualization/

Upvotes: 3

Bogdan Savluk
Bogdan Savluk

Reputation: 6312

To work sourcemaps requires both files, minified and original, often original is included in sourcemap file(it has optional sourcesContent for sources that can not be hosted).

Sourcemap is just JSON file, and you can found all needed information inside:

  • sources - list of source file names,
  • sourcesContent - optional list of original sources, if source is not presented it would be null here.

Utility script, I have written before for this purpose: https://gist.github.com/zxbodya/ca6fb758259f6a077de7

Upvotes: 5

frontend_dev
frontend_dev

Reputation: 1719

I think you won't be able to completely revert such code to its original state as a lot of information (for example comments or certain variable names) is simply lost in the process. When I understand it correctly for sourcemaps to do this you still need the original file.

If you only aim to prettify the code so its readable again you do not need source maps. Many advanced editors have such functions. For example if you are using Sublime text there is this plugin: https://packagecontrol.io/packages/HTML-CSS-JS%20Prettify which does a great job.

Also see this similar question: How can I debug a minified JS in firebug?

Upvotes: -3

Related Questions