Unibeautify
  • Install
  • Docs
  • Assistant
  • Playground
  • GitHub

›B

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

Brace Style

Config Key: brace_style

Description: Brace style

Available since version: 0.7.0 (Current: npm)

Type: string

Default: "collapse"

Allowed values: "collapse" or "collapse-preserve-inline" or "expand" or "end-expand" or "none"

Support

Edit Beautifiers

Languages: EJS, HTML, Handlebars, JSX, JavaScript, Liquid, Mustache, XML

Beautifiers: JS-Beautify, ESLint

Comparison Table

LanguageJS-BeautifyESLint
EJS✅❌
HTML✅❌
Handlebars✅❌
JSX✅✅
JavaScript✅✅
Liquid✅❌
Mustache✅❌
XML✅❌

Examples

Invisible characters are shown with the following symbols:

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

Add EJS Example

No example found. Please submit a Pull Request!

Edit HTML Example

🚧 Original Code

<div>␊
<h1>Unformatted</h1>␊
<div>␊
<span>Un<span>formatted</span></span>␊
</div>␊
<span><span>For</span><span>mat</span><span>ted</span></span>␊
<div><div>For</div><div>mat</div><div>ted</div></div>␊
</div>␊

🔧 "collapse"

Using JS-Beautify beautifier:

<div>␊
··<h1>Unformatted</h1>␊
··<div>␊
····<span>Un<span>formatted</span></span>␊
··</div>␊
··<span><span>For</span><span>mat</span><span>ted</span></span>␊
··<div>␊
····<div>For</div>␊
····<div>mat</div>␊
····<div>ted</div>␊
··</div>␊
</div>

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

{
  "HTML": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "collapse",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: collapse
===================================================================
--- collapse    Original
+++ collapse    Beautified
@@ -1,8 +1,12 @@
 <div>␊
-<h1>Unformatted</h1>␊
-<div>␊
-<span>Un<span>formatted</span></span>␊
-</div>␊
-<span><span>For</span><span>mat</span><span>ted</span></span>␊
-<div><div>For</div><div>mat</div><div>ted</div></div>␊
-</div>␊
+··<h1>Unformatted</h1>␊
+··<div>␊
+····<span>Un<span>formatted</span></span>␊
+··</div>␊
+··<span><span>For</span><span>mat</span><span>ted</span></span>␊
+··<div>␊
+····<div>For</div>␊
+····<div>mat</div>␊
+····<div>ted</div>␊
+··</div>␊
+</div>
\ No newline at end of file

🔧 "collapse-preserve-inline"

Using JS-Beautify beautifier:

<div>␊
··<h1>Unformatted</h1>␊
··<div>␊
····<span>Un<span>formatted</span></span>␊
··</div>␊
··<span><span>For</span><span>mat</span><span>ted</span></span>␊
··<div>␊
····<div>For</div>␊
····<div>mat</div>␊
····<div>ted</div>␊
··</div>␊
</div>

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

{
  "HTML": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "collapse-preserve-inline",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: collapse-preserve-inline
===================================================================
--- collapse-preserve-inline    Original
+++ collapse-preserve-inline    Beautified
@@ -1,8 +1,12 @@
 <div>␊
-<h1>Unformatted</h1>␊
-<div>␊
-<span>Un<span>formatted</span></span>␊
-</div>␊
-<span><span>For</span><span>mat</span><span>ted</span></span>␊
-<div><div>For</div><div>mat</div><div>ted</div></div>␊
-</div>␊
+··<h1>Unformatted</h1>␊
+··<div>␊
+····<span>Un<span>formatted</span></span>␊
+··</div>␊
+··<span><span>For</span><span>mat</span><span>ted</span></span>␊
+··<div>␊
+····<div>For</div>␊
+····<div>mat</div>␊
+····<div>ted</div>␊
+··</div>␊
+</div>
\ No newline at end of file

🔧 "expand"

Using JS-Beautify beautifier:

<div>␊
··<h1>Unformatted</h1>␊
··<div>␊
····<span>Un<span>formatted</span></span>␊
··</div>␊
··<span><span>For</span><span>mat</span><span>ted</span></span>␊
··<div>␊
····<div>For</div>␊
····<div>mat</div>␊
····<div>ted</div>␊
··</div>␊
</div>

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

{
  "HTML": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "expand",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: expand
===================================================================
--- expand  Original
+++ expand  Beautified
@@ -1,8 +1,12 @@
 <div>␊
-<h1>Unformatted</h1>␊
-<div>␊
-<span>Un<span>formatted</span></span>␊
-</div>␊
-<span><span>For</span><span>mat</span><span>ted</span></span>␊
-<div><div>For</div><div>mat</div><div>ted</div></div>␊
-</div>␊
+··<h1>Unformatted</h1>␊
+··<div>␊
+····<span>Un<span>formatted</span></span>␊
+··</div>␊
+··<span><span>For</span><span>mat</span><span>ted</span></span>␊
+··<div>␊
+····<div>For</div>␊
+····<div>mat</div>␊
+····<div>ted</div>␊
+··</div>␊
+</div>
\ No newline at end of file

🔧 "end-expand"

Using JS-Beautify beautifier:

<div>␊
··<h1>Unformatted</h1>␊
··<div>␊
····<span>Un<span>formatted</span></span>␊
··</div>␊
··<span><span>For</span><span>mat</span><span>ted</span></span>␊
··<div>␊
····<div>For</div>␊
····<div>mat</div>␊
····<div>ted</div>␊
··</div>␊
</div>

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

{
  "HTML": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "end-expand",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: end-expand
===================================================================
--- end-expand  Original
+++ end-expand  Beautified
@@ -1,8 +1,12 @@
 <div>␊
-<h1>Unformatted</h1>␊
-<div>␊
-<span>Un<span>formatted</span></span>␊
-</div>␊
-<span><span>For</span><span>mat</span><span>ted</span></span>␊
-<div><div>For</div><div>mat</div><div>ted</div></div>␊
-</div>␊
+··<h1>Unformatted</h1>␊
+··<div>␊
+····<span>Un<span>formatted</span></span>␊
+··</div>␊
+··<span><span>For</span><span>mat</span><span>ted</span></span>␊
+··<div>␊
+····<div>For</div>␊
+····<div>mat</div>␊
+····<div>ted</div>␊
+··</div>␊
+</div>
\ No newline at end of file

🔧 "none"

Using JS-Beautify beautifier:

<div>␊
··<h1>Unformatted</h1>␊
··<div>␊
····<span>Un<span>formatted</span></span>␊
··</div>␊
··<span><span>For</span><span>mat</span><span>ted</span></span>␊
··<div>␊
····<div>For</div>␊
····<div>mat</div>␊
····<div>ted</div>␊
··</div>␊
</div>

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

{
  "HTML": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "none",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,8 +1,12 @@
 <div>␊
-<h1>Unformatted</h1>␊
-<div>␊
-<span>Un<span>formatted</span></span>␊
-</div>␊
-<span><span>For</span><span>mat</span><span>ted</span></span>␊
-<div><div>For</div><div>mat</div><div>ted</div></div>␊
-</div>␊
+··<h1>Unformatted</h1>␊
+··<div>␊
+····<span>Un<span>formatted</span></span>␊
+··</div>␊
+··<span><span>For</span><span>mat</span><span>ted</span></span>␊
+··<div>␊
+····<div>For</div>␊
+····<div>mat</div>␊
+····<div>ted</div>␊
+··</div>␊
+</div>
\ No newline at end of file

Add Handlebars Example

No example found. Please submit a Pull Request!

Edit JSX Example

🚧 Original Code

if·(a)·{␊
··b·=·c;␊
··function·foo(d)·{␊
······e·=·f;␊
··}␊
}␊

🔧 "collapse"

Using JS-Beautify beautifier:

if·(a)·{␊
··b·=·c;␊
␊
··function·foo(d)·{␊
····e·=·f;␊
··}␊
}

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

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "collapse",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: collapse
===================================================================
--- collapse    Original
+++ collapse    Beautified
@@ -1,6 +1,7 @@
 if·(a)·{␊
 ··b·=·c;␊
+␊
 ··function·foo(d)·{␊
-······e·=·f;␊
+····e·=·f;␊
 ··}␊
-}␊
+}
\ No newline at end of file

🔧 "collapse-preserve-inline"

Using JS-Beautify beautifier:

if·(a)·{␊
··b·=·c;␊
␊
··function·foo(d)·{␊
····e·=·f;␊
··}␊
}

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

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "collapse-preserve-inline",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: collapse-preserve-inline
===================================================================
--- collapse-preserve-inline    Original
+++ collapse-preserve-inline    Beautified
@@ -1,6 +1,7 @@
 if·(a)·{␊
 ··b·=·c;␊
+␊
 ··function·foo(d)·{␊
-······e·=·f;␊
+····e·=·f;␊
 ··}␊
-}␊
+}
\ No newline at end of file

🔧 "expand"

Using JS-Beautify beautifier:

if·(a)␊
{␊
··b·=·c;␊
␊
··function·foo(d)␊
··{␊
····e·=·f;␊
··}␊
}

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

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "expand",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: expand
===================================================================
--- expand  Original
+++ expand  Beautified
@@ -1,6 +1,9 @@
-if·(a)·{␊
+if·(a)␊
+{␊
 ··b·=·c;␊
-··function·foo(d)·{␊
-······e·=·f;␊
+␊
+··function·foo(d)␊
+··{␊
+····e·=·f;␊
 ··}␊
-}␊
+}
\ No newline at end of file

🔧 "end-expand"

Using JS-Beautify beautifier:

if·(a)·{␊
··b·=·c;␊
␊
··function·foo(d)·{␊
····e·=·f;␊
··}␊
}

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

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "end-expand",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: end-expand
===================================================================
--- end-expand  Original
+++ end-expand  Beautified
@@ -1,6 +1,7 @@
 if·(a)·{␊
 ··b·=·c;␊
+␊
 ··function·foo(d)·{␊
-······e·=·f;␊
+····e·=·f;␊
 ··}␊
-}␊
+}
\ No newline at end of file

🔧 "none"

Using JS-Beautify beautifier:

if·(a)·{␊
··b·=·c;␊
␊
··function·foo(d)·{␊
····e·=·f;␊
··}␊
}

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

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "none",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,6 +1,7 @@
 if·(a)·{␊
 ··b·=·c;␊
+␊
 ··function·foo(d)·{␊
-······e·=·f;␊
+····e·=·f;␊
 ··}␊
-}␊
+}
\ No newline at end of file

Edit JavaScript Example

🚧 Original Code

if·(a)·{␊
··b·=·c;␊
··function·foo(d)·{␊
······e·=·f;␊
··}␊
··␊
··function·bar(g)·{·h·=·i;·}␊
··␊
··function·baz(j)·␊
··{·␊
····k·=·l;·␊
··}␊
}␊

🔧 "collapse"

Using JS-Beautify beautifier:

if·(a)·{␊
··b·=·c;␊
␊
··function·foo(d)·{␊
····e·=·f;␊
··}␊
␊
··function·bar(g)·{␊
····h·=·i;␊
··}␊
␊
··function·baz(j)·{␊
····k·=·l;␊
··}␊
}

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

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "collapse",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: collapse
===================================================================
--- collapse    Original
+++ collapse    Beautified
@@ -1,13 +1,15 @@
 if·(a)·{␊
 ··b·=·c;␊
+␊
 ··function·foo(d)·{␊
-······e·=·f;␊
+····e·=·f;␊
 ··}␊
-··␊
-··function·bar(g)·{·h·=·i;·}␊
-··␊
-··function·baz(j)·␊
-··{·␊
-····k·=·l;·␊
+␊
+··function·bar(g)·{␊
+····h·=·i;␊
 ··}␊
-}␊
+␊
+··function·baz(j)·{␊
+····k·=·l;␊
+··}␊
+}
\ No newline at end of file

🔧 "collapse-preserve-inline"

Using JS-Beautify beautifier:

if·(a)·{␊
··b·=·c;␊
␊
··function·foo(d)·{␊
····e·=·f;␊
··}␊
␊
··function·bar(g)·{·h·=·i;·}␊
␊
··function·baz(j)·{␊
····k·=·l;␊
··}␊
}

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

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "collapse-preserve-inline",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: collapse-preserve-inline
===================================================================
--- collapse-preserve-inline    Original
+++ collapse-preserve-inline    Beautified
@@ -1,13 +1,13 @@
 if·(a)·{␊
 ··b·=·c;␊
+␊
 ··function·foo(d)·{␊
-······e·=·f;␊
+····e·=·f;␊
 ··}␊
-··␊
+␊
 ··function·bar(g)·{·h·=·i;·}␊
-··␊
-··function·baz(j)·␊
-··{·␊
-····k·=·l;·␊
+␊
+··function·baz(j)·{␊
+····k·=·l;␊
 ··}␊
-}␊
+}
\ No newline at end of file

🔧 "expand"

Using JS-Beautify beautifier:

if·(a)␊
{␊
··b·=·c;␊
␊
··function·foo(d)␊
··{␊
····e·=·f;␊
··}␊
␊
··function·bar(g)␊
··{␊
····h·=·i;␊
··}␊
␊
··function·baz(j)␊
··{␊
····k·=·l;␊
··}␊
}

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

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "expand",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: expand
===================================================================
--- expand  Original
+++ expand  Beautified
@@ -1,13 +1,19 @@
-if·(a)·{␊
+if·(a)␊
+{␊
 ··b·=·c;␊
-··function·foo(d)·{␊
-······e·=·f;␊
+␊
+··function·foo(d)␊
+··{␊
+····e·=·f;␊
 ··}␊
-··␊
-··function·bar(g)·{·h·=·i;·}␊
-··␊
-··function·baz(j)·␊
-··{·␊
-····k·=·l;·␊
+␊
+··function·bar(g)␊
+··{␊
+····h·=·i;␊
 ··}␊
-}␊
+␊
+··function·baz(j)␊
+··{␊
+····k·=·l;␊
+··}␊
+}
\ No newline at end of file

🔧 "end-expand"

Using JS-Beautify beautifier:

if·(a)·{␊
··b·=·c;␊
␊
··function·foo(d)·{␊
····e·=·f;␊
··}␊
␊
··function·bar(g)·{␊
····h·=·i;␊
··}␊
␊
··function·baz(j)·{␊
····k·=·l;␊
··}␊
}

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

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "end-expand",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: end-expand
===================================================================
--- end-expand  Original
+++ end-expand  Beautified
@@ -1,13 +1,15 @@
 if·(a)·{␊
 ··b·=·c;␊
+␊
 ··function·foo(d)·{␊
-······e·=·f;␊
+····e·=·f;␊
 ··}␊
-··␊
-··function·bar(g)·{·h·=·i;·}␊
-··␊
-··function·baz(j)·␊
-··{·␊
-····k·=·l;·␊
+␊
+··function·bar(g)·{␊
+····h·=·i;␊
 ··}␊
-}␊
+␊
+··function·baz(j)·{␊
+····k·=·l;␊
+··}␊
+}
\ No newline at end of file

🔧 "none"

Using JS-Beautify beautifier:

if·(a)·{␊
··b·=·c;␊
␊
··function·foo(d)·{␊
····e·=·f;␊
··}␊
␊
··function·bar(g)·{␊
····h·=·i;␊
··}␊
␊
··function·baz(j)␊
··{␊
····k·=·l;␊
··}␊
}

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

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "none",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,13 +1,16 @@
 if·(a)·{␊
 ··b·=·c;␊
+␊
 ··function·foo(d)·{␊
-······e·=·f;␊
+····e·=·f;␊
 ··}␊
-··␊
-··function·bar(g)·{·h·=·i;·}␊
-··␊
-··function·baz(j)·␊
-··{·␊
-····k·=·l;·␊
+␊
+··function·bar(g)·{␊
+····h·=·i;␊
 ··}␊
-}␊
+␊
+··function·baz(j)␊
+··{␊
+····k·=·l;␊
+··}␊
+}
\ No newline at end of file

Add Liquid Example

No example found. Please submit a Pull Request!

Add Mustache Example

No example found. Please submit a Pull Request!

Edit XML Example

🚧 Original Code

<breakfast_menu>␊
<food>␊
<name>Belgian·Waffles</name>␊
<price>$5.95</price>␊
<description>␊
Two·of·our·famous·Belgian·Waffles·with·plenty·of·real·maple·syrup␊
</description>␊
<calories>650</calories>␊
</food>␊
<food>␊
<name>Strawberry·Belgian·Waffles</name>␊
<price>$7.95</price>␊
<description>␊
Light·Belgian·waffles·covered·with·strawberries·and·whipped·cream␊
</description>␊
<calories>900</calories>␊
</food>␊
</breakfast_menu>

🔧 "collapse"

Using JS-Beautify beautifier:

<breakfast_menu>␊
··<food>␊
····<name>Belgian·Waffles</name>␊
····<price>$5.95</price>␊
····<description>␊
······Two·of·our·famous·Belgian·Waffles·with·plenty·of·real·maple·syrup␊
····</description>␊
····<calories>650</calories>␊
··</food>␊
··<food>␊
····<name>Strawberry·Belgian·Waffles</name>␊
····<price>$7.95</price>␊
····<description>␊
······Light·Belgian·waffles·covered·with·strawberries·and·whipped·cream␊
····</description>␊
····<calories>900</calories>␊
··</food>␊
</breakfast_menu>

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

{
  "XML": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "collapse",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: collapse
===================================================================
--- collapse    Original
+++ collapse    Beautified
@@ -1,18 +1,18 @@
 <breakfast_menu>␊
-<food>␊
-<name>Belgian·Waffles</name>␊
-<price>$5.95</price>␊
-<description>␊
-Two·of·our·famous·Belgian·Waffles·with·plenty·of·real·maple·syrup␊
-</description>␊
-<calories>650</calories>␊
-</food>␊
-<food>␊
-<name>Strawberry·Belgian·Waffles</name>␊
-<price>$7.95</price>␊
-<description>␊
-Light·Belgian·waffles·covered·with·strawberries·and·whipped·cream␊
-</description>␊
-<calories>900</calories>␊
-</food>␊
+··<food>␊
+····<name>Belgian·Waffles</name>␊
+····<price>$5.95</price>␊
+····<description>␊
+······Two·of·our·famous·Belgian·Waffles·with·plenty·of·real·maple·syrup␊
+····</description>␊
+····<calories>650</calories>␊
+··</food>␊
+··<food>␊
+····<name>Strawberry·Belgian·Waffles</name>␊
+····<price>$7.95</price>␊
+····<description>␊
+······Light·Belgian·waffles·covered·with·strawberries·and·whipped·cream␊
+····</description>␊
+····<calories>900</calories>␊
+··</food>␊
 </breakfast_menu>
\ No newline at end of file

🔧 "collapse-preserve-inline"

Using JS-Beautify beautifier:

<breakfast_menu>␊
··<food>␊
····<name>Belgian·Waffles</name>␊
····<price>$5.95</price>␊
····<description>␊
······Two·of·our·famous·Belgian·Waffles·with·plenty·of·real·maple·syrup␊
····</description>␊
····<calories>650</calories>␊
··</food>␊
··<food>␊
····<name>Strawberry·Belgian·Waffles</name>␊
····<price>$7.95</price>␊
····<description>␊
······Light·Belgian·waffles·covered·with·strawberries·and·whipped·cream␊
····</description>␊
····<calories>900</calories>␊
··</food>␊
</breakfast_menu>

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

{
  "XML": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "collapse-preserve-inline",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: collapse-preserve-inline
===================================================================
--- collapse-preserve-inline    Original
+++ collapse-preserve-inline    Beautified
@@ -1,18 +1,18 @@
 <breakfast_menu>␊
-<food>␊
-<name>Belgian·Waffles</name>␊
-<price>$5.95</price>␊
-<description>␊
-Two·of·our·famous·Belgian·Waffles·with·plenty·of·real·maple·syrup␊
-</description>␊
-<calories>650</calories>␊
-</food>␊
-<food>␊
-<name>Strawberry·Belgian·Waffles</name>␊
-<price>$7.95</price>␊
-<description>␊
-Light·Belgian·waffles·covered·with·strawberries·and·whipped·cream␊
-</description>␊
-<calories>900</calories>␊
-</food>␊
+··<food>␊
+····<name>Belgian·Waffles</name>␊
+····<price>$5.95</price>␊
+····<description>␊
+······Two·of·our·famous·Belgian·Waffles·with·plenty·of·real·maple·syrup␊
+····</description>␊
+····<calories>650</calories>␊
+··</food>␊
+··<food>␊
+····<name>Strawberry·Belgian·Waffles</name>␊
+····<price>$7.95</price>␊
+····<description>␊
+······Light·Belgian·waffles·covered·with·strawberries·and·whipped·cream␊
+····</description>␊
+····<calories>900</calories>␊
+··</food>␊
 </breakfast_menu>
\ No newline at end of file

🔧 "expand"

Using JS-Beautify beautifier:

<breakfast_menu>␊
··<food>␊
····<name>Belgian·Waffles</name>␊
····<price>$5.95</price>␊
····<description>␊
······Two·of·our·famous·Belgian·Waffles·with·plenty·of·real·maple·syrup␊
····</description>␊
····<calories>650</calories>␊
··</food>␊
··<food>␊
····<name>Strawberry·Belgian·Waffles</name>␊
····<price>$7.95</price>␊
····<description>␊
······Light·Belgian·waffles·covered·with·strawberries·and·whipped·cream␊
····</description>␊
····<calories>900</calories>␊
··</food>␊
</breakfast_menu>

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

{
  "XML": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "expand",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: expand
===================================================================
--- expand  Original
+++ expand  Beautified
@@ -1,18 +1,18 @@
 <breakfast_menu>␊
-<food>␊
-<name>Belgian·Waffles</name>␊
-<price>$5.95</price>␊
-<description>␊
-Two·of·our·famous·Belgian·Waffles·with·plenty·of·real·maple·syrup␊
-</description>␊
-<calories>650</calories>␊
-</food>␊
-<food>␊
-<name>Strawberry·Belgian·Waffles</name>␊
-<price>$7.95</price>␊
-<description>␊
-Light·Belgian·waffles·covered·with·strawberries·and·whipped·cream␊
-</description>␊
-<calories>900</calories>␊
-</food>␊
+··<food>␊
+····<name>Belgian·Waffles</name>␊
+····<price>$5.95</price>␊
+····<description>␊
+······Two·of·our·famous·Belgian·Waffles·with·plenty·of·real·maple·syrup␊
+····</description>␊
+····<calories>650</calories>␊
+··</food>␊
+··<food>␊
+····<name>Strawberry·Belgian·Waffles</name>␊
+····<price>$7.95</price>␊
+····<description>␊
+······Light·Belgian·waffles·covered·with·strawberries·and·whipped·cream␊
+····</description>␊
+····<calories>900</calories>␊
+··</food>␊
 </breakfast_menu>
\ No newline at end of file

🔧 "end-expand"

Using JS-Beautify beautifier:

<breakfast_menu>␊
··<food>␊
····<name>Belgian·Waffles</name>␊
····<price>$5.95</price>␊
····<description>␊
······Two·of·our·famous·Belgian·Waffles·with·plenty·of·real·maple·syrup␊
····</description>␊
····<calories>650</calories>␊
··</food>␊
··<food>␊
····<name>Strawberry·Belgian·Waffles</name>␊
····<price>$7.95</price>␊
····<description>␊
······Light·Belgian·waffles·covered·with·strawberries·and·whipped·cream␊
····</description>␊
····<calories>900</calories>␊
··</food>␊
</breakfast_menu>

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

{
  "XML": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "end-expand",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: end-expand
===================================================================
--- end-expand  Original
+++ end-expand  Beautified
@@ -1,18 +1,18 @@
 <breakfast_menu>␊
-<food>␊
-<name>Belgian·Waffles</name>␊
-<price>$5.95</price>␊
-<description>␊
-Two·of·our·famous·Belgian·Waffles·with·plenty·of·real·maple·syrup␊
-</description>␊
-<calories>650</calories>␊
-</food>␊
-<food>␊
-<name>Strawberry·Belgian·Waffles</name>␊
-<price>$7.95</price>␊
-<description>␊
-Light·Belgian·waffles·covered·with·strawberries·and·whipped·cream␊
-</description>␊
-<calories>900</calories>␊
-</food>␊
+··<food>␊
+····<name>Belgian·Waffles</name>␊
+····<price>$5.95</price>␊
+····<description>␊
+······Two·of·our·famous·Belgian·Waffles·with·plenty·of·real·maple·syrup␊
+····</description>␊
+····<calories>650</calories>␊
+··</food>␊
+··<food>␊
+····<name>Strawberry·Belgian·Waffles</name>␊
+····<price>$7.95</price>␊
+····<description>␊
+······Light·Belgian·waffles·covered·with·strawberries·and·whipped·cream␊
+····</description>␊
+····<calories>900</calories>␊
+··</food>␊
 </breakfast_menu>
\ No newline at end of file

🔧 "none"

Using JS-Beautify beautifier:

<breakfast_menu>␊
··<food>␊
····<name>Belgian·Waffles</name>␊
····<price>$5.95</price>␊
····<description>␊
······Two·of·our·famous·Belgian·Waffles·with·plenty·of·real·maple·syrup␊
····</description>␊
····<calories>650</calories>␊
··</food>␊
··<food>␊
····<name>Strawberry·Belgian·Waffles</name>␊
····<price>$7.95</price>␊
····<description>␊
······Light·Belgian·waffles·covered·with·strawberries·and·whipped·cream␊
····</description>␊
····<calories>900</calories>␊
··</food>␊
</breakfast_menu>

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

{
  "XML": {
    "indent_size": 2,
    "indent_char": " ",
    "brace_style": "none",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,18 +1,18 @@
 <breakfast_menu>␊
-<food>␊
-<name>Belgian·Waffles</name>␊
-<price>$5.95</price>␊
-<description>␊
-Two·of·our·famous·Belgian·Waffles·with·plenty·of·real·maple·syrup␊
-</description>␊
-<calories>650</calories>␊
-</food>␊
-<food>␊
-<name>Strawberry·Belgian·Waffles</name>␊
-<price>$7.95</price>␊
-<description>␊
-Light·Belgian·waffles·covered·with·strawberries·and·whipped·cream␊
-</description>␊
-<calories>900</calories>␊
-</food>␊
+··<food>␊
+····<name>Belgian·Waffles</name>␊
+····<price>$5.95</price>␊
+····<description>␊
+······Two·of·our·famous·Belgian·Waffles·with·plenty·of·real·maple·syrup␊
+····</description>␊
+····<calories>650</calories>␊
+··</food>␊
+··<food>␊
+····<name>Strawberry·Belgian·Waffles</name>␊
+····<price>$7.95</price>␊
+····<description>␊
+······Light·Belgian·waffles·covered·with·strawberries·and·whipped·cream␊
+····</description>␊
+····<calories>900</calories>␊
+··</food>␊
 </breakfast_menu>
\ No newline at end of file

← Arrow ParensBreak Chained Methods →
  • 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