First, pick your favorite Javascript based Pretty Print/Beautifier. I prefer the one at http://jsbeautifier.org/, because it's what I found first. Downloads its file https://github.com/beautify-web/js-beautify/blob/master/js/lib/beautify.js
Second, download and install The Mozilla group's Java based Javascript engine, Rhino. "Install" is a little bit misleading; Download the zip file, extract everything, place js.jar in your Java classpath (or Library/Java/Extensions on OS X). You can then run scripts with an invocation similar to this
java -cp js.jar org.mozilla.javascript.tools.shell.Main name-of-script.js
Use the Pretty Print/Beautifier from step 1 to write a small shell script that will read in your javascript file and run it through the Pretty Print/Beautifier from step one. For example
//original code
(function() { ... js_beautify code ... }());
//new code
print(global.js_beautify(readFile(arguments[0])));
Rhino gives javascript a few extra useful functions that don't necessarily make sense in a browser context, but do in a console context. The function print does what you'd expect, and prints out a string. The function readFile accepts a file path string as an argument and returns the contents of that file.
You'd invoke the above something like
java -cp js.jar org.mozilla.javascript.tools.shell.Main beautify.js file-to-pp.js
You can mix and match Java and Javascript in your Rhino run scripts, so if you know a little Java it shouldn't be too hard to get this running with text-streams as well.
UPDATE April 2014:
The beautifier has been rewritten since I answered this in 2010. There is now a python module in there, an npm Package for nodejs, and the jar file is gone. Please read the project page on github.com.
Python style:
$ pip install jsbeautifier
NPM style:
$ npm -g install js-beautify
to use it (this will return the beatified js file on the terminal, the main file remains unchanged):
$ js-beautify file.js
To make the changes take effect on the file, you should use this command:
$ js-beautify -r file.js
Original answer
Adding to Answer of @Alan Storm
the command line beautifier based on http://jsbeautifier.org/ has gotten a bit easier to use, because it is now (alternatively) based on the V8 javascript engine (c++ code) instead of rhino (java-based JS engine, packaged as "js.jar"). So you can use V8 instead of rhino.
How to use:
download jsbeautifier.org zip file from http://github.com/einars/js-beautify/zipball/master
(this is a download URL linked to a zip file such as http://download.github.com/einars-js-beautify-10384df.zip)
old (no longer works, jar file is gone)
java -jar js.jar name-of-script.js
new (alternative)
install/compile v8 lib FROM svn, see v8/README.txt in above-mentioned zip file
./jsbeautify somefile.js
-has slightly different command line options than the rhino version,
-and works great in Eclipse when configured as an "External Tool"
If you're using nodejs then try uglify-js
On Linux or Mac, assuming you already have nodejs installed, you can install uglify with:
sudo npm install -g uglify-js
And then get the options:
uglifyjs -h
So if I have a source file foo.js
which looks like this:
// foo.js -- minified
function foo(bar,baz){console.log("something something");return true;}
I can beautify it like so:
uglifyjs foo.js --beautify --output cutefoo.js
uglify
uses spaces for indentation by default so if I want to convert the 4-space-indentation to tabs I can run it through unexpand
which Ubuntu 12.04 comes with:
unexpand --tabs=4 cutefoo.js > cuterfoo.js
Or you can do it all in one go:
uglifyjs foo.js --beautify | unexpand --tabs=4 > cutestfoo.js
You can find out more about unexpand here
so after all this I wind up with a file that looks like so:
function foo(bar, baz) {
console.log("something something");
return true;
}
update 2016-06-07
It appears that the maintainer of uglify-js is now working on version 2 though installation is the same.
$ sudo apt install jsbeautifier
$ js-beautify ugly.js > beautiful.js
For in place beautifying, any of the follwing commands:
$ js-beautify -r file.js
$ js-beautify --replace file.js
In the console, you can use Artistic Style (a.k.a. AStyle) with --mode=java
.
It works great and it's free, open-source and cross-platform (Linux, Mac OS X, Windows).
You have a few one liner choices. Use with npm or standalone with npx.
Semistandar
npx semistandard "js/**/*.js" --fix
Standard
npx standard "js/**/*.js" --fix
Prettier
npx prettier --single-quote --write --trailing-comma all "js/**/*.js"
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With