atom-beautify

Beautify HTML (including Handlebars), CSS (including Sass and LESS) and JavaScript in Atom.

Atom Package: https://atom.io/packages/atom-beautify

Language Support

• JavaScript and JSON
• HTML, including
  • Handlebars
  • XML
• CSS, including
  • Sass
  • LESS
• SQL, special thanks to pretty-data
• PHP
  • Requires PHP_Beautifier to be already installed.
  • See PHP under Advanced Language Setup for setup details

Coming Soon

• Python, see https://github.com/donaldpipowitch/atom-beautify/issues/24
• Ruby, see https://github.com/donaldpipowitch/atom-beautify/issues/25
• CoffeeScript, see https://github.com/donaldpipowitch/atom-beautify/issues/31

Usage

Open the Command Palette, and type Beautify.

It will only beautify selected text, if a selection is found - if not, the whole file will be beautified.

Shortcut

You can also type ctrl-alt-b as a shortcut or click Packages > Beautify in the menu.

Package Options

You can also choose to beautify on every file save.

Configuration

Edit your .jsbeautifyrc file in any of the following locations:

• Atom Package Settings
  Atom ➔ Preferences ➔ Search for atom-beautify
• Same directory as current file
• Project root
  atom-beautify will recursively look up from the current file's directory to find .jsbeautifyrc.
• Your User's Home directory

Note: Comments are supported in .jsbeautifyrc thanks to strip-json-comments.

See examples of both way inside examples/

Simple

See examples/simple-jsbeautifyrc/.jsbeautifyrc.

{
  "indent_size": 2,
  "indent_char": " ",
  "other": " ",
  "indent_level": 0,
  "indent_with_tabs": false,
  "preserve_newlines": true,
  "max_preserve_newlines": 2,
  "jslint_happy": true,
  "indent_handlebars": true
}

Nested

See examples/nested-jsbeautifyrc/.jsbeautifyrc.

{
  "html": {
    "brace_style": "collapse",
    "indent_char": " ",
    "indent_scripts": "normal",
    "indent_size": 6,
    "max_preserve_newlines": 1,
    "preserve_newlines": true,
    "unformatted": ["a", "sub", "sup", "b", "i", "u"],
    "wrap_line_length": 0
  },
  "css": {
    "indent_char": " ",
    "indent_size": 4
  },
  "js": {
    "indent_size": 2,
    "indent_char": " ",
    "indent_level": 0,
    "indent_with_tabs": false,
    "preserve_newlines": true,
    "max_preserve_newlines": 2,
    "jslint_happy": true
  },
  "sql": {
    "indent_size": 4,
    "indent_char": " ",
    "indent_level": 0,
    "indent_with_tabs": false
  }
}

Advanced Language Setup

PHP

To use with PHP we require PHP_Beautifier and that you set the Php beautifier path in the package settings.

Retrieve the path on Mac & Linux

Run which php_beautifier in your Terminal.

Contributing

See all contributors on GitHub.

Please update the CHANGELOG.md, add yourself as a contributor to the package.json, and submit a Pull Request on GitHub.

License

MIT © Donald Pipowitch