Tool to Unminify / Decompress JavaScript

Question

Are there any command line scripts and/or online tools that can reverse the effects of minification similar to how Tidy can clean up horrific HTML?

(I'm specifically looking to unminify a minified JavaScript file, so variable renaming might still be an issue.)

For those of you who may not be aware, minification changes internal variable names to a single letter and removes code comments. Undoing these changes cannot be automated. — Vivian River, Feb 22 '13 at 16:33
@DanielAllenLangdon Good point. I've edited the question so it no longer implies that minification does not change variable names. — Andy Ford, Apr 03 '13 at 16:24
http://marcusjenkins.com/linux/de-minify-javascript-on-the-command-line/ worked well for me. — ychaouche, Mar 08 '15 at 11:07
For @DanielAllenLangdon: jsnice.org can unminify and de-obfuscate even 30k angularjs code. — Green, Sep 04 '15 at 01:09

score 510 · Accepted Answer · answered May 04 '09 at 21:24

510

You can use this : http://jsbeautifier.org/ But it depends on the minify method you are using, this one only formats the code, it doesn't change variable names, nor uncompress base62 encoding.

edit: in fact it can unpack "packed" scripts (packed with Dean Edward's packer : http://dean.edwards.name/packer/)

answered May 04 '09 at 21:24

Fabien Ménager

140,109
3
41
60

did you mean base64 encoding? I've never heard of base62 encoding... – rmeador May 04 '09 at 22:25
5

Nope, I said base 62 : http://dean.edwards.name/packer/ and http://en.wikipedia.org/wiki/Base_62 – Fabien Ménager May 05 '09 at 06:25
4

is there such a thing as a tool that "changes variable names" and is still aware of JS syntax to not break the code? – Jorge Vargas Sep 07 '09 at 07:57
Fantastic. I just solved my problem, then emailed the author of the framework with the exact fix. – Marcus Downing Jul 08 '10 at 11:45

score 161 · Answer 2 · edited Feb 23 '16 at 22:58

161

Chrome developer tools has this feature built-in. Bring up the developer tools (pressing F12 is one way), in the Sources tab, the bottom left bar has a set of icons. The "{}" icon is "Pretty print" and does this conversion on demand.

UPDATE: IE9 "F12 developer tools" also has a "Format JavaScript" feature in the Script tab under the Tools icon there. (see Tip #4 in F12 The best kept web debugging secret)

edited Feb 23 '16 at 22:58

John Slegers

45,213
22
199
169

answered Aug 22 '11 at 15:22

Jon Adams

24,464
18
82
120

1

For the particular .js I was trying to un-minify, this method worked the best, cheers. – igneosaur Oct 06 '11 at 17:33
1

This is now in the "Sources" tab, not the Scripts tab. – mhenry1384 Sep 24 '12 at 21:44
@mhenry1384: Yes, Chrome did rename the tab. I updated the answer accordingly. – Jon Adams Sep 24 '12 at 22:00
YES!! (our app does not have a debug/dev mode for js that I am aware of -- we thankfully do not shorten/transform variable names.) – Steven Lu May 17 '13 at 18:11
2

Just a heads-up: Chrome sometimes messes up the JavaScript code. For instance, `if (a) /regex/.match(foo);` is pretty printed as `if (a)\n / /regex/ .\nmatch(foo);` which is a syntax error. – amphetamachine Jan 09 '15 at 20:01
Firefox does this as well. On the current version, you right-click on the tab for the file you want to examine and select Pretty Print source. – blockcipher Jun 26 '18 at 10:58

score 58 · Answer 3 · answered Jun 22 '09 at 16:26

58

Got it! JSBeautifier does exactly this, and you even have options for the auto-formatting.

answered Jun 22 '09 at 16:26

Robin Rodricks

110,798
141
398
607

5

stackoverflow-then-google instead of google-then-stackoverflow? :)))) – dfa Jun 22 '09 at 16:29
I did the google for "javascript formatter online" – cgp Jun 22 '09 at 16:29
1

This FireFox plugin uses JSBeautifier to un-minify javascript so you can then set breakpoints on lines in FireBug's js debugger!!: https://addons.mozilla.org/en-US/firefox/addon/javascript-deminifier/ – B T Jan 28 '11 at 00:44

score 16 · Answer 4 · answered May 04 '09 at 21:25

16

Can't you just use a javascript formatter (http://javascript.about.com/library/blformat.htm) ?

answered May 04 '09 at 21:25

Janco

1,130
1
8
15

+1 for answer that also works. fabien just happened to reply first – Andy Ford May 04 '09 at 21:30
This only answer the "decompress" part of the question. – Jorge Vargas Sep 07 '09 at 07:58
Nope this is not working good. It break the code... :( – Ramesh Apr 30 '14 at 14:25

katspaugh · Answer 5 · 2011-10-03T21:20:18.170

14

In Firefox, SpiderMonkey and Rhino you can wrap any code into an anonymous function and call its toSource method, which will give you a nicely formatted source of the function.

toSource also strips comments.

E. g.:

(function () { /* Say hello. */ var x = 'Hello!'; print(x); }).toSource()

Will be converted to a string:

function () {
    var x = "Hello!";
    print(x);
}

P. S.: It's not an "online tool", but all questions about general beautifying techniques are closed as duplicates of this one.

edited Oct 03 '11 at 21:20

answered Oct 03 '11 at 12:46

katspaugh

17,449
11
66
103

Interesting. I asked the question 2.5 years ago so I feel it's too late to edit the title, but I still like seeing both online and offline options. Thanks for chiming in. +1 – Andy Ford Oct 03 '11 at 19:55
Doesn't seem to work any more on firefox – Anand Bhushan Sep 28 '20 at 12:56

score 10 · Answer 6 · answered Oct 11 '11 at 22:53

10

If you have a Mac and TextMate - An easy alternative for formatting Javascript is:

Open the file with Textmate.
Click on > Bundles > JavaScript > Reformat Document
Crack open a beer.

answered Oct 11 '11 at 22:53

Stone

2,608
26
26

2

Beer being served right now :) – dgilperez Dec 09 '11 at 16:48

score 7 · Answer 7 · answered Jun 21 '11 at 17:09

7

Most of the IDEs also offer auto-formatting features. For example in NetBeans, just press CTRL+K.

answered Jun 21 '11 at 17:09

gou1

316
3
10

score 5 · Answer 8 · edited May 23 '17 at 11:55

5

Similar to Stone's answer, but for Windows/.NET developers:

If you have Visual Studio and ReSharper - An easy alternative for formatting Javascript is:

Open the file with Visual Studio;
Click on ReSharper > Tools > Cleanup Code (Ctrl+E, C);
Select "Default: Reformat code", and click OK;
Crack open a beer.

edited May 23 '17 at 11:55

Community

1
1

answered Jun 13 '12 at 11:53

C. Augusto Proiete

24,684
2
63
91

score 5 · Answer 9 · answered Sep 21 '09 at 22:57

As an alternative (since I didn't know about jsbeautifier.org until now), I have used a bookmarklet that reenabled the decode button in Dean Edward's Packer.

I found the instructions and bookmarklet here.

here is the bookmarklet (in case the site is down)

javascript:for%20(i=0;i<document.forms.length;++i)%20{for(j=0;j<document.forms[i].elements.length;++j){document.forms[i].elements[j].removeAttribute(%22readonly%22);document.forms[i].elements[j].removeAttribute(%22disabled%22);}}

score 5 · Answer 10 · answered May 23 '11 at 03:18

5

I'm not sure if you need source code. There is a free online JavaScript formatter at http://www.blackbeltcoder.com/Resources/JSFormatter.aspx.

answered May 23 '11 at 03:18

Jonathan Wood

65,341
71
269
466

score 5 · Answer 11 · answered Oct 22 '11 at 12:59

5

Try this one, with code coloration:

http://labs.swelen.com/tools/javascript/beauty.html

answered Oct 22 '11 at 12:59

Swelen Team

53
1
3

score 5 · Answer 12 · answered Jan 18 '12 at 05:52

5

click on these link for JS deminification. That will install on FF as extension that help you in debugging js at runtime.

https://addons.mozilla.org/en-US/firefox/addon/javascript-deminifier/eula/141018?src=dp-btn-primary

answered Jan 18 '12 at 05:52

sanjeev

51
1
1

score 4 · Answer 13 · answered Aug 13 '13 at 12:49

4

Despite its miles-away-from-being-pretty interface, JSPretty is a good, free and online tool for making javascript source codes human-readable. You can enforce your preferred type of indentation and it can also detect obfuscation.

answered Aug 13 '13 at 12:49

Farshid

5,134
9
59
87

score 3 · Answer 14 · answered Jul 29 '12 at 10:04

3

Pretty Diff will beautify (pretty print) JavaScript in a way that conforms to JSLint and JSHint white space algorithms.

answered Jul 29 '12 at 10:04

austincheney

1,189
9
11

It's ironic the site is so un-pretty, but this is a cool tool. – Andy Ford Jul 30 '12 at 21:48

score 3 · Answer 15 · answered Nov 18 '13 at 20:21

3

Wasn't really happy with the output of jsbeautifier.org for what I was putting in, so I did some more searching and found this site: http://www.centralinternet.com.br/javascript-beautifier

Worked extremely well for me.

answered Nov 18 '13 at 20:21

Arielle Lewis

540
4
14

score 3 · Answer 16 · answered Apr 29 '11 at 08:34

3

If one is in JS possibility of using Firefox is more. And if its Firefox add on is for rescue. Following one is particularly useful.

https://addons.mozilla.org/en-US/firefox/addon/phoenix/

answered Apr 29 '11 at 08:34

Anil Namde

6,452
11
63
100

score 2 · Answer 17 · answered Dec 28 '12 at 03:56

2

http://unminify.appspot.com/ Great tools for unminify javascript and json

answered Dec 28 '12 at 03:56

Bui Dinh Ngoc

447
4
10

Tool to Unminify / Decompress JavaScript

17 Answers17

Linked

Related