github.com/beautifier/js-beautify @v2.0.3 sqlite
README
![NPM stats](https://nodei.co/npm/js-beautify.svg?downloadRank=true&downloads=true"/)
This little beautifier will reformat and re-indent bookmarklets, ugly JavaScript, unpack scripts packed by Dean Edward’s popular packer, as well as partly deobfuscate scripts processed by the npm package javascript-obfuscator.
Open beautifier.io to try it out. Options are available via the UI.
Contributors Needed
I'm putting this front and center above because existing owners have very limited time to work on this project currently. This is a popular project and widely used but it desperately needs contributors who have time to commit to fixing both customer facing bugs and underlying problems with the internal design and implementation.
If you are interested, please take a look at the CONTRIBUTING.md then fix an issue marked with the "Good first issue" label and submit a PR. Repeat as often as possible. Thanks!
Installation
You can install the beautifier for Node.js or Python.
Node.js JavaScript
You may install the NPM package js-beautify. When installed globally, it provides an executable js-beautify script. As with the Python script, the beautified result is sent to stdout unless otherwise configured.
$ npm -g install js-beautify
$ js-beautify foo.js
You can also use js-beautify as a node library (install locally, the npm default):
$ npm install js-beautify
Node.js JavaScript (vNext)
The above install the latest stable release. To install beta or RC versions:
$ npm install js-beautify@next
Web Library
The beautifier can be added on your page as web library.
JS Beautifier is hosted on two CDN services: cdnjs and rawgit.
To pull the latest version from one of these services include one set of the script tags below in your document:
<script src="https://cdnjs.cloudflare.com/ajax/libs/js-beautify/2.0.3/beautify.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/js-beautify/2.0.3/beautify-css.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/js-beautify/2.0.3/beautify-html.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/js-beautify/2.0.3/beautify.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/js-beautify/2.0.3/beautify-css.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/js-beautify/2.0.3/beautify-html.min.js"></script>
Example usage of a JS tag in html:
<!DOCTYPE html>
<html lang="en">
<body>
. . .
<script src="https://cdnjs.cloudflare.com/ajax/libs/js-beautify/2.0.3/beautify.min.js"></script>
<script src="https://github.com/beautifier/js-beautify/raw/v2.0.3/script.js"></script>
</body>
</html>
Older versions are available by changing the version number.
Disclaimer: These are free services, so there are no uptime or support guarantees.
Python
To install the Python version of the beautifier:
$ pip install jsbeautifier
Unlike the JavaScript version, the Python version can only reformat JavaScript. It does not work against HTML or CSS files, but you can install css-beautify for CSS:
$ pip install cssbeautifier
Note: This project no longer supports Python 2.
Usage
You can beautify JavaScript using JS Beautifier in your web browser, or on the command-line using Node.js or Python.
Web Browser
Open beautifier.io. Options are available via the UI.
Web Library
After you embed the <script> tags in your html file, they expose three functions: js_beautify, css_beautify, and html_beautify
Example usage of beautifying a json string:
const options = { indent_size: 2, space_in_empty_paren: true }
const dataObj = {completed: false,id: 1,title: "delectus aut autem",userId: 1,}
const dataJson = JSON.stringify(dataObj)
js_beautify(dataJson, options)
/* OUTPUT
{
"completed": false,
"id": 1,
"title": "delectus aut autem",
"userId": 1,
}
*/
Node.js JavaScript
When installed globally, the beautifier provides an executable js-beautify script. The beautified result is sent to stdout unless otherwise configured.
$ js-beautify foo.js
To use js-beautify as a node library (after install locally), import and call the appropriate beautifier method for JavaScript (JS), CSS, or HTML. All three method signatures are beautify(code, options). code is the string of code to be beautified. options is an object with the settings you would like used to beautify the code.
The configuration option names are the same as the CLI names but with underscores instead of dashes. For example, --indent-size 2 --space-in-empty-paren would be { indent_size: 2, space_in_empty_paren: true }.
var beautify = require('js-beautify/js').js,
fs = require('fs');
fs.readFile('foo.js', 'utf8', function (err, data) {
if (err) {
throw err;
}
console.log(beautify(data, { indent_size: 2, space_in_empty_paren: true }));
});
If you are using ESM Imports, you can import js-beautify like this:
// 'beautify' can be any name here.
import beautify from 'js-beautify';
beautify.js(data, options);
beautify.html(data, options);
beautify.css(data, options);
Python
After installing, to beautify using Python:
$ js-beautify file.js
Beautified output goes to stdout by default.
To use jsbeautifier as a library is simple:
import jsbeautifier
res = jsbeautifier.beautify('your JavaScript string')
res = jsbeautifier.beautify_file('some_file.js')
...or, to specify some options:
opts = jsbeautifier.default_options()
opts.indent_size = 2
opts.space_in_empty_paren = True
res = jsbeautifier.beautify('some JavaScript', opts)
The configuration option names are the same as the CLI names but with underscores instead of dashes. The example above would be set on the command-line as --indent-size 2 --space-in-empty-paren.
Options
These are the command-line flags for both Python and JS scripts:
CLI Options:
-f, --file Input file(s) (Pass '-' for stdin)
-r, --replace Write output in-place, replacing input
-o, --outfile Write output to file (default stdout)
--config Path to config file
--type [js|css|html] ["js"] Select beautifier type (NOTE: Does *not* filter files, only defines which beautifier type to run)
-q, --quiet Suppress logging to stdout
-h, --help Show this help
-v, --version Show the version
Beautifier Options:
-s, --indent-size Indentation size [4]
-c, --indent-char Indentation character [" "]
-t, --indent-with-tabs Indent with tabs, overrides -s and -c
-e, --eol Character(s) to use as line terminators.
[first newline in file, otherwise "\n]
-n, --end-with-newline End output with newline
--editorconfig Use EditorConfig to set up the options
-l, --indent-level Initial indentation level [0]
-p, --preserve-newlines Preserve line-breaks (--no-preserve-newlines disables)
-m, --max-preserve-newlines Number of line-breaks to be preserved in one chunk [10]
-P, --space-in-paren Add padding spaces within paren, ie. f( a, b )
-E, --space-in-empty-paren Add a single space inside empty paren, ie. f( )
-j, --jslint-happy Enable jslint-stricter mode
-a, --space-after-anon-function Add a space before an anonymous function's parens, ie. function ()
--space-after-named-function Add a space before a named function's parens, i.e. function example ()
-b, --brace-style [collapse|expand|end-expand|none][,preserve-inline] [collapse,preserve-inline]
-u, --unindent-chained-methods Don't indent chained method calls
-B, --break-chained-methods Break chained method calls across subsequent lines
-k, --keep-array-indentation Preserve array indentation
-x, --unescape-strings Decode printable characters encoded in xNN notation
-w, --wrap-line-length Wrap lines that exceed N characters [0]
-X, --e4x Pass E4X xml literals through untouched
--good-stuff Warm the cockles of Crockford's heart
-C, --comma-first Put commas at the beginning of new line instead of end
-O, --operator-position Set operator position (before-newline|after-newline|preserve-newline) [before-newline]
--indent-empty-lines Keep indentation on empty lines
--templating List of templating languages (auto,django,erb,handlebars,php,smarty,angular) ["auto"] auto = none in JavaScript, all in HTML
Which correspond to the underscored option keys for both library interfaces
defaults per CLI options
{
"indent_size": 4,
"indent_char": " ",
"indent_with_tabs": false,
"editorconfig": false,
"eol": "\n",
"end_with_newline": false,
"indent_level": 0,
"preserve_newlines": true,
"max_preserve_newlines": 10,
"space_in_paren": false,
"space_in_empty_paren": false,
"jslint_happy": false,
"space_after_anon_function": false,
"space_after_named_function": false,
"brace_style": "collapse",
"unindent_chained_methods": false,
"break_chained_methods": false,
"keep_array_indentation": false,
"unescape_strings": false,
"wrap_line_length": 0,
"e4x": false,
"comma_first": false,
"operator_position": "before-newline",
"indent_empty_lines": false,
"templating": ["auto"]
}
defaults not exposed in the cli
{
"eval_code": false,
"space_before_conditional": true
}
Notice not all defaults are exposed via the CLI. Historically, the Python and JS APIs have not been 100% identical. There are still a few other additional cases keeping us from 100% API-compatibility.
Loading settings from environment or .jsbeautifyrc (JavaScript-Only)
In addition to CLI arguments, you may pass config to the JS executable via:
- any
jsbeautify_-prefixed environment variables - a
JSON-formatted file indicated by the--configparameter - a
.jsbeautifyrcfile containingJSONdata at any level of the filesystem above$PWD
Configuration sources provided earlier in this stack will override later ones.
Setting inheritance and Language-specific overrides
The settings are a shallow tree whose values are inherited for all languages, but can be overridden. This works for settings passed directly to the API in either implementation. In the JavaScript implementation, settings loaded from a config file, such as .jsbeautifyrc, can also use inheritance/overriding.
Below is an example configuration tree showing all the supported locations
for language override nodes. We'll use indent_size to discuss how this configuration would behave, but any number of settings can be inherited or overridden:
{
"indent_size": 4,
"html": {
"end_with_newline": true,
"js": {
"indent_size": 2
},
"css": {
"indent_size": 2
}
},
"css": {
"indent_size": 1
},
"js": {
"preserve-newlines": true
}
}
Using the above example would have the following result:
- HTML files
- Inherit
indent_sizeof 4 spaces from the top-level setting. - The files would also end with a newline.
- JavaScript and CSS inside HTML
- Inherit the HTML
end_with_newlinesetting. - Override their indentation to 2 spaces.
- Inherit the HTML
- CSS files
- Override the top-level setting to an
indent_sizeof 1 space. - JavaScript files
- Inherit
indent_sizeof 4 spaces from the top-level setti
Core symbols most depended-on inside this repo
btShape
Languages
Modules by API surface
Used by 24 indexed graphs manifest dependencies, hub-wide
Dependencies from manifests, versioned
For agents
$ claude mcp add js-beautify \
-- python -m otcore.mcp_server <graph>