Unibeautify
  • Install
  • Docs
  • Assistant
  • Playground
  • GitHub

›A

A

  • Align Assignments
  • Arrow Parens

B

  • Brace Style
  • Break Chained Methods

C

  • Comma First

E

  • End With Comma
  • End With Newline
  • End With Semicolon

F

  • Force Indentation

I

  • Identifier Case
  • Indent Chained Methods
  • Indent Comments
  • Indent Inner Html
  • Indent Scripts
  • Indent Size
  • Indent Style

J

  • JSLint Happy
  • JSX Brackets

K

  • Keep Array Indentation
  • Keyword Case

M

  • Max Preserve Newlines
  • Multiline Ternary

N

  • Newline Before Tags
  • Newline Between Rules
  • No Leading Zero

O

  • Object Curly Spacing

P

  • Pragma Insert
  • Pragma Require
  • Preserve Newlines

Q

  • Quotes

R

  • Remove Trailing Whitespace

S

  • Selector Separator Newline
  • Space After Anon Function
  • Space Before Conditional
  • Space In Empty Paren
  • Space In Paren

U

  • Unescape Strings
  • Unformatted

W

  • Wrap Attributes
  • Wrap Attributes Indent Size
  • Wrap Line Length
  • Wrap Prose
Edit

Align Assignments

Config Key: align_assignments

Description: If lists of assignments or properties should be vertically aligned for faster and easier reading.

Available since version: 0.7.0 (Current: npm)

Type: boolean

Default: false

Support

Edit Beautifiers

Languages: C#, EJS, JSX, Java, JavaScript, Riot, Swig, Twig, TypeScript

Beautifiers: Pretty Diff

Comparison Table

LanguagePretty Diff
C#✅
EJS✅
JSX✅
Java✅
JavaScript✅
Riot✅
Swig✅
Twig✅
TypeScript✅

Examples

Invisible characters are shown with the following symbols:

Carriage Return = ␍; Line Feed = ␊; Tab = ⇥; Whitespace = ·.

Edit C# Example

🚧 Original Code

using·System;␊
␊
namespace·VariableDefinition·{␊
···class·Program·{␊
······static·void·Main(string[]·args)·{␊
·········short·a·=·10,·a1·=·11,·a2·=·22;␊
·········int·b·=·20,·b1·=·21,·b2·=·32;␊
·········double·c·=·a·+·b;␊
······}␊
···}␊
}␊

🔧 true

Using Pretty Diff beautifier:

using·System;␊
␊
namespace·VariableDefinition·{␊
··class·Program·{␊
····static·void·Main(string[]·args)·{␊
······short·a··=·10,␊
······a1·······=·11,␊
······a2·······=·22;␊
······int·b····=·20,␊
······b1·······=·21,␊
······b2·······=·32;␊
······double·c·=·a·+·b;␊
····}␊
··}␊
}␊

How to configure A .unibeautify.json file would look like the following:

{
  "C#": {
    "indent_size": 2,
    "indent_char": " ",
    "align_assignments": true,
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: true
===================================================================
--- true    Original
+++ true    Beautified
@@ -1,11 +1,15 @@
 using·System;␊
 ␊
 namespace·VariableDefinition·{␊
-···class·Program·{␊
-······static·void·Main(string[]·args)·{␊
-·········short·a·=·10,·a1·=·11,·a2·=·22;␊
-·········int·b·=·20,·b1·=·21,·b2·=·32;␊
-·········double·c·=·a·+·b;␊
-······}␊
-···}␊
+··class·Program·{␊
+····static·void·Main(string[]·args)·{␊
+······short·a··=·10,␊
+······a1·······=·11,␊
+······a2·······=·22;␊
+······int·b····=·20,␊
+······b1·······=·21,␊
+······b2·······=·32;␊
+······double·c·=·a·+·b;␊
+····}␊
+··}␊
 }␊

🔧 false

Using Pretty Diff beautifier:

using·System;␊
␊
namespace·VariableDefinition·{␊
··class·Program·{␊
····static·void·Main(string[]·args)·{␊
······short·a·=·10,␊
······a1·=·11,␊
······a2·=·22;␊
······int·b·=·20,␊
······b1·=·21,␊
······b2·=·32;␊
······double·c·=·a·+·b;␊
····}␊
··}␊
}␊

How to configure A .unibeautify.json file would look like the following:

{
  "C#": {
    "indent_size": 2,
    "indent_char": " ",
    "align_assignments": false,
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: false
===================================================================
--- false   Original
+++ false   Beautified
@@ -1,11 +1,15 @@
 using·System;␊
 ␊
 namespace·VariableDefinition·{␊
-···class·Program·{␊
-······static·void·Main(string[]·args)·{␊
-·········short·a·=·10,·a1·=·11,·a2·=·22;␊
-·········int·b·=·20,·b1·=·21,·b2·=·32;␊
-·········double·c·=·a·+·b;␊
-······}␊
-···}␊
+··class·Program·{␊
+····static·void·Main(string[]·args)·{␊
+······short·a·=·10,␊
+······a1·=·11,␊
+······a2·=·22;␊
+······int·b·=·20,␊
+······b1·=·21,␊
+······b2·=·32;␊
+······double·c·=·a·+·b;␊
+····}␊
+··}␊
 }␊

Add EJS Example

No example found. Please submit a Pull Request!

Edit JSX Example

🚧 Original Code

const·a·=·"",␊
b·=·"",␊
c·=·"";

🔧 true

Using Pretty Diff beautifier:

const·a·=·"",␊
··b·····=·"",␊
··c·····=·"";

How to configure A .unibeautify.json file would look like the following:

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "align_assignments": true,
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: true
===================================================================
--- true    Original
+++ true    Beautified
@@ -1,3 +1,3 @@
 const·a·=·"",␊
-b·=·"",␊
-c·=·"";
\ No newline at end of file
+··b·····=·"",␊
+··c·····=·"";
\ No newline at end of file

🔧 false

Using Pretty Diff beautifier:

const·a·=·"",␊
··b·=·"",␊
··c·=·"";

How to configure A .unibeautify.json file would look like the following:

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "align_assignments": false,
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: false
===================================================================
--- false   Original
+++ false   Beautified
@@ -1,3 +1,3 @@
 const·a·=·"",␊
-b·=·"",␊
-c·=·"";
\ No newline at end of file
+··b·=·"",␊
+··c·=·"";
\ No newline at end of file

Edit Java Example

🚧 Original Code

public·class·Sample·{␊
··public·static·void·main(String[]·args)·{␊
····int·a·=·3;␊
····int·A·=·7;␊
····String·one·=·"",·two·=·"",·three·=·"";␊
··}␊
}

🔧 true

Using Pretty Diff beautifier:

public·class·Sample·{␊
··public·static·void·main(String[]·args)·{␊
····int·a······=·3;␊
····int·A······=·7;␊
····String·one·=·"",␊
····two········=·"",␊
····three······=·"";␊
··}␊
}

How to configure A .unibeautify.json file would look like the following:

{
  "Java": {
    "indent_size": 2,
    "indent_char": " ",
    "align_assignments": true,
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: true
===================================================================
--- true    Original
+++ true    Beautified
@@ -1,7 +1,9 @@
 public·class·Sample·{␊
 ··public·static·void·main(String[]·args)·{␊
-····int·a·=·3;␊
-····int·A·=·7;␊
-····String·one·=·"",·two·=·"",·three·=·"";␊
+····int·a······=·3;␊
+····int·A······=·7;␊
+····String·one·=·"",␊
+····two········=·"",␊
+····three······=·"";␊
 ··}␊
 }
\ No newline at end of file

🔧 false

Using Pretty Diff beautifier:

public·class·Sample·{␊
··public·static·void·main(String[]·args)·{␊
····int·a·=·3;␊
····int·A·=·7;␊
····String·one·=·"",␊
····two·=·"",␊
····three·=·"";␊
··}␊
}

How to configure A .unibeautify.json file would look like the following:

{
  "Java": {
    "indent_size": 2,
    "indent_char": " ",
    "align_assignments": false,
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: false
===================================================================
--- false   Original
+++ false   Beautified
@@ -1,7 +1,9 @@
 public·class·Sample·{␊
 ··public·static·void·main(String[]·args)·{␊
 ····int·a·=·3;␊
 ····int·A·=·7;␊
-····String·one·=·"",·two·=·"",·three·=·"";␊
+····String·one·=·"",␊
+····two·=·"",␊
+····three·=·"";␊
 ··}␊
 }
\ No newline at end of file

Edit JavaScript Example

🚧 Original Code

const·a·=·"",␊
b·=·"",␊
c·=·"";

🔧 true

Using Pretty Diff beautifier:

const·a·=·"",␊
··b·····=·"",␊
··c·····=·"";

How to configure A .unibeautify.json file would look like the following:

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "align_assignments": true,
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: true
===================================================================
--- true    Original
+++ true    Beautified
@@ -1,3 +1,3 @@
 const·a·=·"",␊
-b·=·"",␊
-c·=·"";
\ No newline at end of file
+··b·····=·"",␊
+··c·····=·"";
\ No newline at end of file

🔧 false

Using Pretty Diff beautifier:

const·a·=·"",␊
··b·=·"",␊
··c·=·"";

How to configure A .unibeautify.json file would look like the following:

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "align_assignments": false,
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: false
===================================================================
--- false   Original
+++ false   Beautified
@@ -1,3 +1,3 @@
 const·a·=·"",␊
-b·=·"",␊
-c·=·"";
\ No newline at end of file
+··b·=·"",␊
+··c·=·"";
\ No newline at end of file

Add Riot Example

No example found. Please submit a Pull Request!

Add Swig Example

No example found. Please submit a Pull Request!

Add Twig Example

No example found. Please submit a Pull Request!

Edit TypeScript Example

🚧 Original Code

const·a·=·"",␊
b·=·"",␊
c·=·"";

🔧 true

Using Pretty Diff beautifier:

const·a·=·"",␊
··b·····=·"",␊
··c·····=·"";

How to configure A .unibeautify.json file would look like the following:

{
  "TypeScript": {
    "indent_size": 2,
    "indent_char": " ",
    "align_assignments": true,
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: true
===================================================================
--- true    Original
+++ true    Beautified
@@ -1,3 +1,3 @@
 const·a·=·"",␊
-b·=·"",␊
-c·=·"";
\ No newline at end of file
+··b·····=·"",␊
+··c·····=·"";
\ No newline at end of file

🔧 false

Using Pretty Diff beautifier:

const·a·=·"",␊
··b·=·"",␊
··c·=·"";

How to configure A .unibeautify.json file would look like the following:

{
  "TypeScript": {
    "indent_size": 2,
    "indent_char": " ",
    "align_assignments": false,
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: false
===================================================================
--- false   Original
+++ false   Beautified
@@ -1,3 +1,3 @@
 const·a·=·"",␊
-b·=·"",␊
-c·=·"";
\ No newline at end of file
+··b·=·"",␊
+··c·=·"";
\ No newline at end of file

Arrow Parens →
  • Support
  • Examples
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