Unibeautify
  • Install
  • Docs
  • Assistant
  • Playground
  • GitHub

›Usage

About

  • What is Unibeautify
  • Unibeautify CI
  • Credits

Usage

  • Getting Started
  • Command-Line Interface (CLI)
  • Configuration File
  • Language Options
  • Beautifier Options
  • Supported Languages
  • Editor Integration

Contributing

  • Examples

Integrations

  • GitHub
  • GitLab
  • Bitbucket

Beautifiers

  • Black
  • Brittany
  • ClangFormat
  • CSScomb
  • ESLint
  • Gofmt
  • JS-Beautify
  • PHP-CS-Fixer
  • PHP_CodeSniffer
  • Prettier
  • Pretty Diff
  • sqlformat
  • stylelint
  • TSLint
  • YAPF
Edit

Editor Integration

Atom

What is Atom?

A hackable text editor for the 21st Century by GitHub.

How to format code in Atom?

BeforeAfter
Original HTMLBeautified HTML
imageimage

See https://github.com/Glavin001/atom-beautify for installation instructions.

Atom-Beautify does not yet use Unibeautify. Subscribe to https://github.com/Glavin001/atom-beautify/issues/1174 for updates on Atom-Beautify supporting Unibeautify. Until the migration to using Unibeautify is complete please use Atom-Beautify's own documentation found at https://github.com/Glavin001/atom-beautify/blob/master/docs/options.md

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

image

How to format on save in Atom?

In Atom-Beautify, format/beautify on save can be enabled or disabled 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

What is the keyboard shortcut in Atom?

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

See Keymaps In-Depth for more details on how to customize.

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

Emacs

What is Emacs?

An extensible, customizable, free/libre text editor — and more.

How to format code in Emacs?

Emacs is not yet supported. Please help us by contributing! Thanks in advance!

See https://github.com/Unibeautify/emacs to contribute.

Sublime Text

What is Sublime Text?

A sophisticated text editor for code, markup and prose.

How to format code in Sublime Text?

Sublime Text plugin is not yet implemented. Please help us by contributing! Thanks in advance!

See https://github.com/Unibeautify/unibeautify-sublime to contribute.

Vim

What is Vim?

The ubiquitous text editor.

How to format code in Vim?

Vim is not yet supported. Please help us by contributing! Thanks in advance!

Visual Studio

What is Visual Studio?

Best-in-class tools for any developer.

How to format code in Visual Studio?

Visual Studio extension is not yet implemented. Please help us by contributing! Thanks in advance!

Visual Studio Code

What is Visual Studio Code?

Code editing. Redefined.

How to format code in Visual Studio Code?

Unibeautify Visual Studio Code Format Demo

See https://github.com/Unibeautify/vscode for installation instructions.

Open the Command Palette (Ctrl + Shift + P on Windows or Command + Shift + P on Mac) and search for format:

  • Format Document - Formats the entire editor document.
  • Format Selection - Formats only the selection. Only appears when text selected.

unibeautify-format-command-palette

How to format on save in Visual Studio Code?

You can turn on format on save for all languages with the VSCode setting:

"editor.formatOnSave": false,

Or enable only for specific langauges:

"editor.formatOnSave": false,
"[javascript]": {
    "editor.formatOnSave": true
}

See https://code.visualstudio.com/updates/v1_6#_format-on-save for more details.

What is the keyboard shortcut in Visual Studio Code?

  • Windows: Shift + Alt + F
  • Mac: Shift + Option + F
  • Ubuntu: Ctrl + Shift + I

WebStorm

What is WebStorm?

The smartest JavaScript IDE.

How to format code in WebStorm?

WebStorm is not yet supported. Please help us by contributing! Thanks in advance!

← Supported LanguagesExamples →
  • Atom
    • What is Atom?
    • How to format code in Atom?
    • How to format on save in Atom?
    • What is the keyboard shortcut in Atom?
  • Emacs
    • What is Emacs?
    • How to format code in Emacs?
  • Sublime Text
    • What is Sublime Text?
    • How to format code in Sublime Text?
  • Vim
    • What is Vim?
    • How to format code in Vim?
  • Visual Studio
    • What is Visual Studio?
    • How to format code in Visual Studio?
  • Visual Studio Code
    • What is Visual Studio Code?
    • How to format code in Visual Studio Code?
    • How to format on save in Visual Studio Code?
    • What is the keyboard shortcut in Visual Studio Code?
  • WebStorm
    • What is WebStorm?
    • How to format code in WebStorm?
Unibeautify
Docs
Getting StartedCLIConfigurationOptions
Community
User ShowcaseStack Overflow@Unibeautify on TwitterFollow Unibeautify on Twitter
More
GitHubStar Unibeautify on GitHubCode coverage of UnibeautifyCode coverage of Unibeautify
© 2020 Glavin Wiechert
Credits