Convert Figma logo to code with AI

Glavin001 logoatom-beautify

:mega: Help Wanted - Looking for Maintainer: https://github.com/Glavin001/atom-beautify/issues/2572 | :lipstick: Universal beautification package for Atom editor (:warning: Currently migrating to https://github.com/Unibeautify/ and have very limited bandwidth for Atom-Beautify Issues. Thank you for your patience and understanding :heart: )

1,496
453
1,496
390

Top Related Projects

49,046

Prettier is an opinionated code formatter.

Code beautifier

Beautifier for javascript

A tool to automatically fix PHP Coding Standards issues

38,528

The uncompromising Python code formatter

Quick Overview

Atom-beautify is a popular package for the Atom text editor that automatically formats and beautifies code across multiple programming languages. It supports a wide range of languages and formatting options, allowing developers to maintain consistent code style with minimal effort.

Pros

  • Supports a large number of programming languages (over 150)
  • Highly customizable with language-specific options
  • Integrates seamlessly with the Atom editor
  • Can be used with external beautifiers for enhanced functionality

Cons

  • May have conflicts with other Atom packages or language-specific formatters
  • Some languages require additional setup or external beautifiers
  • Performance can be slow for large files or complex formatting rules
  • Occasional inconsistencies in formatting across different languages

Getting Started

  1. Install Atom text editor
  2. Open Atom and go to Settings > Install
  3. Search for "atom-beautify" and click Install
  4. Once installed, you can use the following methods to beautify your code:
    • Use the keyboard shortcut Ctrl+Alt+B (Cmd+Alt+B on macOS)
    • Right-click in the editor and select "Beautify editor contents"
    • Go to Packages > Atom Beautify > Beautify

For language-specific configuration:

  1. Go to Settings > Packages > Atom Beautify > Settings
  2. Scroll to the language you want to configure
  3. Adjust the options as needed (e.g., indent size, line endings, etc.)

For more advanced usage and troubleshooting, refer to the official documentation on the GitHub repository.

Competitor Comparisons

49,046

Prettier is an opinionated code formatter.

Pros of Prettier

  • Language-agnostic with support for many file types
  • Opinionated formatting with minimal configuration options
  • Integrates well with various editors and CI/CD pipelines

Cons of Prettier

  • Less flexibility in formatting options
  • May require more setup for complex projects with mixed languages

Code Comparison

Atom Beautify (JavaScript):

function example(foo,bar) {
    return foo+bar;
}

Prettier (JavaScript):

function example(foo, bar) {
  return foo + bar;
}

Key Differences

  • Atom Beautify is specific to the Atom editor, while Prettier is editor-agnostic
  • Prettier focuses on opinionated, consistent formatting across projects
  • Atom Beautify offers more granular control over formatting options

Use Cases

  • Atom Beautify: Best for Atom users who need customizable formatting
  • Prettier: Ideal for teams wanting consistent code style across different editors and projects

Community and Maintenance

  • Prettier has a larger community and more frequent updates
  • Atom Beautify's development has slowed since Atom's deprecation

Integration

  • Prettier integrates easily with various build tools and CI/CD pipelines
  • Atom Beautify is primarily designed for use within the Atom editor

Code beautifier

Pros of uncrustify

  • Supports a wide range of programming languages
  • Highly configurable with extensive options for code formatting
  • Can be used as a standalone tool or integrated into various editors

Cons of uncrustify

  • Steeper learning curve due to complex configuration options
  • Limited GUI support, primarily command-line based
  • May require more manual setup compared to atom-beautify

Code comparison

atom-beautify:

beautify.beautify(editor).then(function() {
  console.log('Beautification complete');
}).catch(function(error) {
  console.error('Error:', error);
});

uncrustify:

int main(int argc, char *argv[])
{
    uncrustify_file(filename, lang_flag, &err_file, &fmt_file);
    return 0;
}

Summary

uncrustify is a powerful, language-agnostic code formatter with extensive customization options, making it suitable for advanced users and complex projects. It excels in flexibility but may require more setup time.

atom-beautify, on the other hand, offers a more user-friendly experience with its integration into the Atom editor, making it easier for beginners to start beautifying their code quickly. However, it may have fewer advanced configuration options compared to uncrustify.

The choice between the two depends on the user's needs, programming languages used, and desired level of customization.

Beautifier for javascript

Pros of js-beautify

  • Language-agnostic: Supports multiple languages including JavaScript, CSS, HTML, and JSON
  • Standalone tool: Can be used as a command-line utility or integrated into various editors
  • Highly configurable: Offers extensive options for customizing formatting rules

Cons of js-beautify

  • Limited scope: Focuses solely on code beautification, lacking additional features
  • Manual integration: Requires manual setup in some editors, unlike Atom-specific plugins

Code comparison

atom-beautify:

atom.commands.add('atom-workspace', {
  'atom-beautify:beautify-editor': () => {
    const editor = atom.workspace.getActiveTextEditor();
    if (editor) {
      beautify(editor);
    }
  }
});

js-beautify:

const beautify = require('js-beautify').js;
const fs = require('fs');

const ugly = fs.readFileSync('file.js', 'utf8');
const pretty = beautify(ugly, { indent_size: 2, space_in_empty_paren: true });
fs.writeFileSync('file.js', pretty, 'utf8');

Summary

While js-beautify offers a versatile, language-agnostic approach to code beautification with extensive configuration options, atom-beautify provides a more integrated experience specifically for Atom users. js-beautify's standalone nature allows for broader application across different environments, but it may require more manual setup in some cases. atom-beautify, on the other hand, offers a seamless integration within the Atom ecosystem, potentially providing a more user-friendly experience for Atom users.

A tool to automatically fix PHP Coding Standards issues

Pros of PHP-CS-Fixer

  • Specialized for PHP, offering more comprehensive and tailored PHP code styling options
  • Command-line tool that can be easily integrated into CI/CD pipelines
  • Actively maintained with frequent updates and a large community

Cons of PHP-CS-Fixer

  • Limited to PHP only, unlike atom-beautify which supports multiple languages
  • Requires separate installation and configuration outside of the editor
  • Steeper learning curve for non-technical users compared to atom-beautify's GUI

Code Comparison

atom-beautify (JavaScript):

atom.commands.add('atom-workspace', {
  'atom-beautify:beautify-editor': () => {
    const editor = atom.workspace.getActiveTextEditor();
    if (editor) beautify(editor);
  }
});

PHP-CS-Fixer (PHP):

<?php
$config = new PhpCsFixer\Config();
return $config->setRules([
    '@PSR2' => true,
    'array_syntax' => ['syntax' => 'short'],
])
->setFinder(PhpCsFixer\Finder::create()->in(__DIR__));

Both tools aim to improve code formatting, but PHP-CS-Fixer focuses exclusively on PHP with more advanced options, while atom-beautify provides a broader, multi-language approach within the Atom editor environment.

38,528

The uncompromising Python code formatter

Pros of Black

  • Highly opinionated and consistent formatting, reducing debates over code style
  • Faster execution time, especially for large codebases
  • Integrated with popular Python tools and CI/CD pipelines

Cons of Black

  • Less flexibility in formatting options compared to Atom Beautify
  • Limited to Python language support only
  • Stricter line length limits may require more manual intervention

Code Comparison

Black:

def long_function_name(
    var_one: int, var_two: str, var_three: float, var_four: bool
) -> None:
    print(f"{var_one}, {var_two}, {var_three}, {var_four}")

Atom Beautify:

def long_function_name(var_one: int,
                       var_two: str,
                       var_three: float,
                       var_four: bool) -> None:
    print(f"{var_one}, {var_two}, {var_three}, {var_four}")

Black enforces a specific style with arguments on separate lines and closing parenthesis on its own line. Atom Beautify allows more flexibility in formatting, such as aligning arguments vertically.

Both tools aim to improve code readability, but Black's approach is more rigid and standardized, while Atom Beautify offers more customization options across multiple languages. Black is specifically designed for Python, making it a powerful choice for Python-centric projects, whereas Atom Beautify supports a wider range of programming languages.

Convert Figma logo designs to code with AI

Visual Copilot

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot

README

:lipstick: atom-beautify

apm GitHub stars GitHub issues Greenkeeper badge

Slack Twitter Follow Gitter Bountysource Paypal Donations

:point_right: Sign up for CodePass, the Quickest Way To Solve Your Coding Errors! :boom:

:tada: Install Unibeautify CI for GitHub :tada:

Help improve Atom-Beautify by completing the quick questionnaire: https://goo.gl/iEHBNr

Mac OS and
Travis CI: Build StatusAppVeyor: Build status

Throughput Graph

Beautify HTML, CSS, JavaScript, PHP, Python, Ruby, Java, C, C++, C#, Objective-C, CoffeeScript, TypeScript, Coldfusion, SQL, and more in Atom

BeforeAfter
Original HTMLBeautified HTML
imageimage

Table of Contents

Installation

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

apm install atom-beautify

Or Settings/Preferences ➔ Install ➔ Search for atom-beautify

:tada: Install Unibeautify CI for GitHub :tada:

Important Notice: Analytics

Atom-Beautify respects the core.telemetryConsent configuration option from Atom editor. If you do not wish to have usage data sent to Google Analytics then please set core.telemetryConsent to no or undecided option before using Atom-Beautify. See Anonymous Analytics section of docs for details. Thank you.

On Atom LoadChange Setting Later
imageimage

Next Version: Unibeautify

Atom-Beautify is going to be completely rewritten with Unibeautify at its core! See unibeautify branch for work in progress and Issue #1174.

:tada: Install Unibeautify CI for GitHub :tada:

Poll: Improving installation of third-party beautifiers

Many users are experiencing issues when installing third party beautifiers (e.g. Uncrustify, PHP-CS-Fixer, and many more). A possible solution is a "cloud" service which provides remote access to these beautifiers. Atom-Beautify would then communicate with these services, allowing for zero-installation beautification.

Please let us know what you think!

Beautifiers

Some of the supported beautifiers are developed for Node.js and are automatically installed when Atom-Beautify is installed. However, other beautifiers are command-line interface (CLI) applications and require you to manually install them.

BeautifierPreinstalled:whale: DockerInstallation
align-yaml:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
autopep8:warning: 2 executables:warning: Only 1 of 2 executables:whale: With Docker:
1. Install autopep8 (autopep8) with docker pull unibeautify/autopep8

:bookmark_tabs: Manually:
1. Install autopep8 (autopep8) by following https://github.com/hhatto/autopep8#installation
2. Install isort (isort) by following https://github.com/timothycrosley/isort#installing-isort
beautysh:warning: 1 executable:white_check_mark: :100:% of executables:whale: With Docker:
1. Install beautysh (beautysh) with docker pull unibeautify/beautysh

:bookmark_tabs: Manually:
1. Install beautysh (beautysh) by following https://github.com/bemeurer/beautysh#installation
black:warning: 1 executable:x: No Docker support:bookmark_tabs: Manually:
1. Install black (black) by following https://github.com/ambv/black#installation
brittany:warning: Manual installation:construction: Not an executable:page_facing_up: Go to https://github.com/lspitzner/brittany and follow the instructions.
clang-format:warning: 1 executable:white_check_mark: :100:% of executables:whale: With Docker:
1. Install ClangFormat (clang-format) with docker pull unibeautify/clang-format

:bookmark_tabs: Manually:
1. Install ClangFormat (clang-format) by following https://clang.llvm.org/docs/ClangFormat.html
cljfmt:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
Coffee Formatter:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
coffee-fmt:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
Crystal:warning: 1 executable:white_check_mark: :100:% of executables:whale: With Docker:
1. Install Crystal (crystal) with docker pull unibeautify/crystal

:bookmark_tabs: Manually:
1. Install Crystal (crystal) by following https://crystal-lang.org/docs/installation/
CSScomb:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
dfmt:warning: 1 executable:x: No Docker support:bookmark_tabs: Manually:
1. Install Dfmt (dfmt) by following https://github.com/dlang-community/dfmt#building
elm-format:warning: 1 executable:white_check_mark: :100:% of executables:whale: With Docker:
1. Install elm-format (elm-format) with docker pull unibeautify/elm-format

:bookmark_tabs: Manually:
1. Install elm-format (elm-format) by following https://github.com/avh4/elm-format#installation-
Emacs Verilog Mode:warning: 1 executable:x: No Docker support:bookmark_tabs: Manually:
1. Install Emacs (emacs) by following https://www.gnu.org/software/emacs/
erl_tidy:warning: Manual installation:construction: Not an executable:page_facing_up: Go to http://erlang.org/doc/man/erl_tidy.html and follow the instructions.
ESLint Fixer:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
formatR:warning: 1 executable:white_check_mark: :100:% of executables:whale: With Docker:
1. Install Rscript (rscript) with docker pull unibeautify/rscript

:bookmark_tabs: Manually:
1. Install Rscript (rscript) by following https://github.com/yihui/formatR
Fortran Beautifier:warning: 1 executable:x: No Docker support:bookmark_tabs: Manually:
1. Install Emacs (emacs) by following https://www.gnu.org/software/emacs/
Gherkin formatter:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
GN:warning: 1 executable:x: No Docker support:bookmark_tabs: Manually:
1. Install gn (gn) by following https://www.chromium.org/developers/how-tos/get-the-code
gofmt:warning: Manual installation:construction: Not an executable:page_facing_up: Go to https://golang.org/cmd/gofmt/ and follow the instructions.
goimports:warning: 1 executable:white_check_mark: :100:% of executables:whale: With Docker:
1. Install goimports (goimports) with docker pull unibeautify/goimports

:bookmark_tabs: Manually:
1. Install goimports (goimports) by following https://godoc.org/golang.org/x/tools/cmd/goimports
hh_format:warning: Manual installation:construction: Not an executable:page_facing_up: Go to http://hhvm.com/ and follow the instructions.
hindent:warning: Manual installation:construction: Not an executable:page_facing_up: Go to https://github.com/commercialhaskell/hindent and follow the instructions.
HTML Beautifier:warning: Manual installation:construction: Not an executable:page_facing_up: Go to https://github.com/threedaymonk/htmlbeautifier and follow the instructions.
JS Beautify:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
JSCS Fixer:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
Latex Beautify:warning: Manual installation:construction: Not an executable:page_facing_up: Go to https://github.com/cmhughes/latexindent.pl and follow the instructions.
Lua beautifier:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
Marko Beautifier:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
Nginx Beautify:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
ocamlformat:warning: 1 executable:x: No Docker support:bookmark_tabs: Manually:
1. Install ocamlformat (ocamlformat) by following https://github.com/ocaml-ppx/ocamlformat#installation
ocp-indent:warning: 1 executable:white_check_mark: :100:% of executables:whale: With Docker:
1. Install ocp-indent (ocp-indent) with docker pull unibeautify/ocp-indent

:bookmark_tabs: Manually:
1. Install ocp-indent (ocp-indent) by following https://www.typerex.org/ocp-indent.html#installation
Perltidy:warning: Manual installation:construction: Not an executable:page_facing_up: Go to http://perltidy.sourceforge.net/ and follow the instructions.
PHP-CS-Fixer:warning: 2 executables:warning: Only 1 of 2 executables:whale: With Docker:
1. Install PHP-CS-Fixer (php-cs-fixer) with docker pull unibeautify/php-cs-fixer

:bookmark_tabs: Manually:
1. Install PHP (php) by following http://php.net/manual/en/install.php
2. Install PHP-CS-Fixer (php-cs-fixer) by following https://github.com/FriendsOfPHP/PHP-CS-Fixer#installation
PHPCBF:warning: 2 executables:warning: Only 1 of 2 executables:whale: With Docker:
1. Install PHPCBF (phpcbf) with docker pull unibeautify/phpcbf

:bookmark_tabs: Manually:
1. Install PHP (php) by following http://php.net/manual/en/install.php
2. Install PHPCBF (phpcbf) by following https://github.com/squizlabs/PHP_CodeSniffer#installation
Prettier:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
Pretty Diff:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
Pug Beautify:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
puppet-lint:warning: 1 executable:white_check_mark: :100:% of executables:whale: With Docker:
1. Install puppet-lint (puppet-lint) with docker pull unibeautify/puppet-lint

:bookmark_tabs: Manually:
1. Install puppet-lint (puppet-lint) by following http://puppet-lint.com/
pybeautifier:warning: Manual installation:construction: Not an executable:page_facing_up: Go to https://github.com/guyskk/pybeautifier and follow the instructions.
Remark:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
Rubocop:warning: 1 executable:x: No Docker support:bookmark_tabs: Manually:
1. Install Rubocop (rubocop) by following http://rubocop.readthedocs.io/en/latest/installation/
Ruby Beautify:warning: Manual installation:construction: Not an executable:page_facing_up: Go to https://github.com/erniebrodeur/ruby-beautify and follow the instructions.
rustfmt:warning: Manual installation:construction: Not an executable:page_facing_up: Go to https://github.com/rust-lang-nursery/rustfmt and follow the instructions.
SassConvert:warning: 1 executable:white_check_mark: :100:% of executables:whale: With Docker:
1. Install SassConvert (sass-convert) with docker pull unibeautify/sass-convert

:bookmark_tabs: Manually:
1. Install SassConvert (sass-convert) by following http://sass-lang.com/documentation/file.SASS_REFERENCE.html#syntax
sqlformat:warning: Manual installation:construction: Not an executable:page_facing_up: Go to https://github.com/andialbrecht/sqlparse and follow the instructions.
stylish-haskell:warning: Manual installation:construction: Not an executable:page_facing_up: Go to https://github.com/jaspervdj/stylish-haskell and follow the instructions.
terraformfmt:warning: 1 executable:white_check_mark: :100:% of executables:whale: With Docker:
1. Install Terraform (terraform) with docker pull hashicorp/terraform

:bookmark_tabs: Manually:
1. Install Terraform (terraform) by following https://www.terraform.io
Tidy Markdown:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
TypeScript Formatter:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
Uncrustify:warning: 1 executable:white_check_mark: :100:% of executables:whale: With Docker:
1. Install Uncrustify (uncrustify) with docker pull unibeautify/uncrustify

:bookmark_tabs: Manually:
1. Install Uncrustify (uncrustify) by following https://github.com/uncrustify/uncrustify
VHDL Beautifier:warning: 1 executable:x: No Docker support:bookmark_tabs: Manually:
1. Install Emacs (emacs) by following https://www.gnu.org/software/emacs/
Vue Beautifier:white_check_mark::ok_hand: Not necessary:smiley: Nothing!
yapf:warning: Manual installation:construction: Not an executable:page_facing_up: Go to https://github.com/google/yapf and follow the instructions.

Language Support

See all supported options in the documentation at docs/options.md.

LanguageGrammarsFile ExtensionsSupported Beautifiers
ApexApex.cls, .triggerUncrustify
ArduinoArduino.ino, .pdeUncrustify
BashShell Script.bash, .shbeautysh
BladeBlade.blade.phpJS Beautify
CC, opencl.h, .c, .clUncrustify, clang-format
Coldfusionhtml.cfm, .cfml, .cfcPretty Diff
ClojureClojure.clj, .cljs, .edncljfmt
CoffeeScriptCoffeeScript.coffeecoffee-fmt, Coffee Formatter
C++C++.h, .hh, .cc, .cpp, .cxx, .C, .cu, .c++, .hpp, .hxx, .h++, .cuhUncrustify, clang-format
CrystalCrystal.crCrystal
C#C#.csUncrustify
CSSCSS.cssJS Beautify, CSScomb, Prettier, Pretty Diff, SassConvert
CSVCSV.csvPretty Diff
DD.dUncrustify, dfmt
EJSEJS, JavaScript Template, HTML (Angular).ejsJS Beautify, Pretty Diff
ElmElm.elmelm-format
ERBHTML (Ruby - ERB), HTML (Rails).erbPretty Diff, HTML Beautifier
ErlangErlang.erlerl_tidy
FortranFortran - Modern.f90, .F90, .f95, .F95, .f03, .F03, .f08, .F08Fortran Beautifier
gherkinGherkin.featureGherkin formatter
GLSLC, opencl, GLSL.vert, .fragclang-format
GNgn.gn, .gniGN
GoGo.gogofmt, goimports
Golang TemplateHTML (Go), Go Template.gohtmlPretty Diff
HandlebarsHandlebars, HTML (Handlebars).hbs, .handlebarsJS Beautify, Pretty Diff
HaskellHaskell.hsstylish-haskell, brittany, hindent
HTMLHTML.htmlJS Beautify, Pretty Diff
JadeJade, Pug.jade, .pugPug Beautify
JavaJava.javaUncrustify
JavaScriptJavaScript.jsJS Beautify, ESLint Fixer, JSCS Fixer, Prettier, Pretty Diff
JSONJSON.jsonJS Beautify, Prettier, Pretty Diff
JSXJSX, JavaScript (JSX), Babel ES6 JavaScript, JavaScript with JSX.jsx, .jsPretty Diff, JS Beautify
LaTeXBibTeX, LaTeX, TeX.bib, .tex, .sty, .cls, .dtx, .ins, .bbx, .cbxLatex Beautify
LESSLESS.lessPretty Diff, CSScomb, Prettier
LuaLua.lua, .ttsluaLua beautifier
MarkdownGitHub Markdown.markdown, .mdRemark, Prettier, Tidy Markdown
MarkoMarko.markoMarko Beautifier
MustacheHTML (Mustache).mustacheJS Beautify, Pretty Diff
Nginxnginx.confNginx Beautify
NunjucksNunjucks, Nunjucks Templates, HTML (Nunjucks Templates).njk, .nunjucksPretty Diff
Objective-CObjective-C, Objective-C++.m, .mm, .hUncrustify, clang-format
OCamlOCaml.mlocp-indent, ocamlformat
PawnPawnUncrustify
PerlPerl, Perl 6.pl, .PL, .pm, .pod, .tPerltidy
PHPPHP.php, .module, .incPHP-CS-Fixer, PHPCBF, hh_format
PuppetPuppet.pppuppet-lint
PythonPython, MagicPython.pyautopep8, black, pybeautifier, yapf
RR.r, .RformatR
Riot.jsRiot.js, HTML (Riot Tag).tagPretty Diff
RubyRuby, Ruby on Rails.rbRubocop, Ruby Beautify
RustRust.rs, .rlibrustfmt
SassSass.sassSassConvert
SCSSSCSS.scssPretty Diff, CSScomb, Prettier, SassConvert
SpacebarsSpacebarsPretty Diff
SQLSQL (Rails), SQL.sqlsqlformat
SVGSVG.svgPretty Diff
SwigHTML (Swig), SWIG.swigPretty Diff
TerraformTerraform.tfterraformfmt
TSSTSS.tssPretty Diff
TSXTypeScriptReact.tsxTypeScript Formatter
TwigHTML (Twig).twigPretty Diff
TypeScriptTypeScript.tsTypeScript Formatter, Prettier
UX MarkupUX.uxPretty Diff
ValaVala.vala, .vapiUncrustify
VerilogVerilog.svh, .v, .svEmacs Verilog Mode
VHDLVHDL 2008.vhd, .VHDVHDL Beautifier
VisualforceVisualforce.pagePretty Diff
VueVue Component.vueVue Beautifier, ESLint Fixer, Prettier
XMLSLD, XML, XHTML, XSD, XSL, JSP, GSP.sld, .xml, .xhtml, .xsd, .xsl, .jsp, .gsp, .plist, .recipe, .configPretty Diff, JS Beautify
XTemplateXTemplate.xtemplatePretty Diff
YAMLYAML.yml, .yamlalign-yaml

Usage

Command Palette

Open the Command Palette, type Beautify, and run Beautify Editor.

image

Beautify a Specific Language

You can use the Command Palette to beautify the editor for a specific language. The commands are in the form Atom Beautify: Beautify Language {NAME} (i.e. atom-beautify:beautify-language-{NAME} for keyboard shortcuts). For example, you may want to beautify JavaScript code within a HTML file.

atom-beautify-language-commands

Selection of Code

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

Selection of CodeBeautify Selection of CodeBeautify Entire File
Select code in Atom editorOnly that selection is beautifiedWithout a selection all code is beautified
imageimageimage

Beautify On Save

Beautify On Save can be enabled for each language individually.

For example, for language HTML go into Atom-Beautify's package settings (Atom ➔ Preferences ➔ Search for atom-beautify), find HTML, and toggle the Beautify On Save option.

atom-beautify-setup-beautify-on-save

Keyboard Shortcut

You can also type Ctrl-Alt-B as a shortcut or click Packages > Beautify in the menu.

Custom Keyboard Shortcuts

See Keymaps In-Depth for more details.

For example:

'.editor':
  'ctrl-alt-b': 'atom-beautify:beautify-editor'

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 ways inside examples/

See all supported options in the documentation at docs/options.md.

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 (Recommended)

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
  }
}

Troubleshooting

See docs/troubleshooting.md.

Contributing

See CONTRIBUTING.md.

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 © Glavin Wiechert

NPM DownloadsLast 30 Days