Unibeautify
  • Install
  • Docs
  • Assistant
  • Playground
  • GitHub

›W

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

Wrap Line Length

Config Key: wrap_line_length

Description: Wrap lines at next opportunity after N characters

Available since version: 0.7.0 (Current: npm)

Type: integer

Default: 80

Support

Edit Beautifiers

Languages: C#, CSS, ColdFusion, EJS, GraphQL, HTML, HTML+ERB, Handlebars, JSX, Java, JavaScript, Less, Liquid, Markdown, Mustache, Python, Riot, SCSS, SVG, Sass, Spacebars, SugarSS, Swig, Titanium Style Sheets, Twig, TypeScript, Visualforce, XML, XTemplate

Beautifiers: Prettier, JS-Beautify, Pretty Diff, Black, stylelint

Comparison Table

LanguagePrettierJS-BeautifyPretty DiffBlackstylelint
C#❌❌✅❌❌
CSS✅✅✅❌✅
ColdFusion❌❌✅❌❌
EJS❌✅✅❌❌
GraphQL✅❌❌❌❌
HTML❌✅✅❌❌
HTML+ERB❌❌✅❌❌
Handlebars❌✅✅❌❌
JSX✅✅✅❌❌
Java❌❌✅❌❌
JavaScript✅✅✅❌❌
Less✅❌✅❌✅
Liquid❌✅❌❌❌
Markdown✅❌❌❌❌
Mustache❌✅❌❌❌
Python❌❌❌✅❌
Riot❌❌✅❌❌
SCSS✅❌✅❌✅
SVG❌❌✅❌❌
Sass❌❌❌❌✅
Spacebars❌❌✅❌❌
SugarSS❌❌❌❌✅
Swig❌❌✅❌❌
Titanium Style Sheets❌❌✅❌❌
Twig❌❌✅❌❌
TypeScript✅❌✅❌❌
Visualforce❌❌✅❌❌
XML❌✅✅❌❌
XTemplate❌❌✅❌❌

Examples

Invisible characters are shown with the following symbols:

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

Edit C# Example

🚧 Original Code

using·System;␊
␊
class·Program␊
{␊
static·void·iLoveVeryLongRunOnFunctioNames(string·longArg1,·string·anotherArg,·string·tooManyArgs)␊
{␊
Console.WriteLine("Hello,·world!");␊
}␊
}␊
␊

🔧 0

Using Pretty Diff beautifier:

using·System;␊
␊
class·Program·{␊
··static·void·iLoveVeryLongRunOnFunctioNames(string·longArg1,·string·anotherArg,·string·tooManyArgs)·{␊
····Console.WriteLine("Hello,·world!");␊
··}␊
}␊

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

{
  "C#": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified
@@ -1,10 +1,7 @@
 using·System;␊
 ␊
-class·Program␊
-{␊
-static·void·iLoveVeryLongRunOnFunctioNames(string·longArg1,·string·anotherArg,·string·tooManyArgs)␊
-{␊
-Console.WriteLine("Hello,·world!");␊
+class·Program·{␊
+··static·void·iLoveVeryLongRunOnFunctioNames(string·longArg1,·string·anotherArg,·string·tooManyArgs)·{␊
+····Console.WriteLine("Hello,·world!");␊
+··}␊
 }␊
-}␊
-␊

🔧 40

Using Pretty Diff beautifier:

using·System;␊
␊
class·Program·{␊
··static·void·iLoveVeryLongRunOnFunctioNames(␊
····string·longArg1,␊
····string·anotherArg,␊
····string·tooManyArgs␊
··)·{␊
····Console.WriteLine("Hello,·world!");␊
··}␊
}␊

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

{
  "C#": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified
@@ -1,10 +1,11 @@
 using·System;␊
 ␊
-class·Program␊
-{␊
-static·void·iLoveVeryLongRunOnFunctioNames(string·longArg1,·string·anotherArg,·string·tooManyArgs)␊
-{␊
-Console.WriteLine("Hello,·world!");␊
+class·Program·{␊
+··static·void·iLoveVeryLongRunOnFunctioNames(␊
+····string·longArg1,␊
+····string·anotherArg,␊
+····string·tooManyArgs␊
+··)·{␊
+····Console.WriteLine("Hello,·world!");␊
+··}␊
 }␊
-}␊
-␊

🔧 80

Using Pretty Diff beautifier:

using·System;␊
␊
class·Program·{␊
··static·void·iLoveVeryLongRunOnFunctioNames(␊
····string·longArg1,␊
····string·anotherArg,␊
····string·tooManyArgs␊
··)·{␊
····Console.WriteLine("Hello,·world!");␊
··}␊
}␊

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

{
  "C#": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified
@@ -1,10 +1,11 @@
 using·System;␊
 ␊
-class·Program␊
-{␊
-static·void·iLoveVeryLongRunOnFunctioNames(string·longArg1,·string·anotherArg,·string·tooManyArgs)␊
-{␊
-Console.WriteLine("Hello,·world!");␊
+class·Program·{␊
+··static·void·iLoveVeryLongRunOnFunctioNames(␊
+····string·longArg1,␊
+····string·anotherArg,␊
+····string·tooManyArgs␊
+··)·{␊
+····Console.WriteLine("Hello,·world!");␊
+··}␊
 }␊
-}␊
-␊

🔧 120

Using Pretty Diff beautifier:

using·System;␊
␊
class·Program·{␊
··static·void·iLoveVeryLongRunOnFunctioNames(string·longArg1,·string·anotherArg,·string·tooManyArgs)·{␊
····Console.WriteLine("Hello,·world!");␊
··}␊
}␊

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

{
  "C#": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified
@@ -1,10 +1,7 @@
 using·System;␊
 ␊
-class·Program␊
-{␊
-static·void·iLoveVeryLongRunOnFunctioNames(string·longArg1,·string·anotherArg,·string·tooManyArgs)␊
-{␊
-Console.WriteLine("Hello,·world!");␊
+class·Program·{␊
+··static·void·iLoveVeryLongRunOnFunctioNames(string·longArg1,·string·anotherArg,·string·tooManyArgs)·{␊
+····Console.WriteLine("Hello,·world!");␊
+··}␊
 }␊
-}␊
-␊

🔧 160

Using Pretty Diff beautifier:

using·System;␊
␊
class·Program·{␊
··static·void·iLoveVeryLongRunOnFunctioNames(string·longArg1,·string·anotherArg,·string·tooManyArgs)·{␊
····Console.WriteLine("Hello,·world!");␊
··}␊
}␊

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

{
  "C#": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified
@@ -1,10 +1,7 @@
 using·System;␊
 ␊
-class·Program␊
-{␊
-static·void·iLoveVeryLongRunOnFunctioNames(string·longArg1,·string·anotherArg,·string·tooManyArgs)␊
-{␊
-Console.WriteLine("Hello,·world!");␊
+class·Program·{␊
+··static·void·iLoveVeryLongRunOnFunctioNames(string·longArg1,·string·anotherArg,·string·tooManyArgs)·{␊
+····Console.WriteLine("Hello,·world!");␊
+··}␊
 }␊
-}␊
-␊

Edit CSS Example

🚧 Original Code

.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

🔧 0

Using Prettier beautifier:

.fixedHeaderContainer.sticky␊
··header␊
··>·a␊
··img,␊
.separateOnPageNav␊
··.fixedHeaderContainer␊
··header␊
··>·a␊
··img·{␊
··height:·30px;␊
}␊

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

{
  "CSS": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified
@@ -1,3 +1,11 @@
-.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
+.fixedHeaderContainer.sticky␊
+··header␊
+··>·a␊
+··img,␊
+.separateOnPageNav␊
+··.fixedHeaderContainer␊
+··header␊
+··>·a␊
+··img·{␊
 ··height:·30px;␊
 }␊

🔧 40

Using Prettier beautifier:

.fixedHeaderContainer.sticky␊
··header␊
··>·a␊
··img,␊
.separateOnPageNav␊
··.fixedHeaderContainer␊
··header␊
··>·a␊
··img·{␊
··height:·30px;␊
}␊

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

{
  "CSS": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified
@@ -1,3 +1,11 @@
-.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
+.fixedHeaderContainer.sticky␊
+··header␊
+··>·a␊
+··img,␊
+.separateOnPageNav␊
+··.fixedHeaderContainer␊
+··header␊
+··>·a␊
+··img·{␊
 ··height:·30px;␊
 }␊

🔧 80

Using Prettier beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,␊
.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

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

{
  "CSS": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified
@@ -1,3 +1,4 @@
-.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
+.fixedHeaderContainer.sticky·header·>·a·img,␊
+.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
 ··height:·30px;␊
 }␊

🔧 120

Using Prettier beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,␊
.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

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

{
  "CSS": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified
@@ -1,3 +1,4 @@
-.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
+.fixedHeaderContainer.sticky·header·>·a·img,␊
+.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
 ··height:·30px;␊
 }␊

🔧 160

Using Prettier beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,␊
.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

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

{
  "CSS": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified
@@ -1,3 +1,4 @@
-.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
+.fixedHeaderContainer.sticky·header·>·a·img,␊
+.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
 ··height:·30px;␊
 }␊

Edit ColdFusion Example

🚧 Original Code

<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊

🔧 0

Using Pretty Diff beautifier:

<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>

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

{
  "ColdFusion": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified
@@ -1,1 +1,1 @@
-<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊
+<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>
\ No newline at end of file

🔧 40

Using Pretty Diff beautifier:

<div>Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.</div>

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

{
  "ColdFusion": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified
@@ -1,1 +1,8 @@
-<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊
+<div>Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.</div>
\ No newline at end of file

🔧 80

Using Pretty Diff beautifier:

<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at·all.</div>

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

{
  "ColdFusion": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified
@@ -1,1 +1,4 @@
-<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊
+<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at·all.</div>
\ No newline at end of file

🔧 120

Using Pretty Diff beautifier:

<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at·all.</div>

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

{
  "ColdFusion": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified
@@ -1,1 +1,3 @@
-<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊
+<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at·all.</div>
\ No newline at end of file

🔧 160

Using Pretty Diff beautifier:

<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.␊
··Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>

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

{
  "ColdFusion": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified
@@ -1,1 +1,2 @@
-<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊
+<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.␊
+··Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>
\ No newline at end of file

Add EJS Example

No example found. Please submit a Pull Request!

Edit GraphQL Example

🚧 Original Code

{␊
··iLoveVeryLongQueryNames(longArg1:·"string",·anotherArg:·123,·tooManyArgs:·true)·{␊
····field1␊
····field2·{␊
······nestedField1␊
······nestedField2·{␊
········doubleNestedField1␊
········doubleNestedField2·{␊
··········tripleNestedField1␊
········}␊
······}␊
····}␊
··}␊
}

🔧 0

Using Prettier beautifier:

{␊
··iLoveVeryLongQueryNames(␊
····longArg1:·"string"␊
····anotherArg:·123␊
····tooManyArgs:·true␊
··)·{␊
····field1␊
····field2·{␊
······nestedField1␊
······nestedField2·{␊
········doubleNestedField1␊
········doubleNestedField2·{␊
··········tripleNestedField1␊
········}␊
······}␊
····}␊
··}␊
}␊

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

{
  "GraphQL": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified
@@ -1,6 +1,10 @@
 {␊
-··iLoveVeryLongQueryNames(longArg1:·"string",·anotherArg:·123,·tooManyArgs:·true)·{␊
+··iLoveVeryLongQueryNames(␊
+····longArg1:·"string"␊
+····anotherArg:·123␊
+····tooManyArgs:·true␊
+··)·{␊
 ····field1␊
 ····field2·{␊
 ······nestedField1␊
 ······nestedField2·{␊
@@ -10,5 +14,5 @@
 ········}␊
 ······}␊
 ····}␊
 ··}␊
-}
\ No newline at end of file
+}␊

🔧 40

Using Prettier beautifier:

{␊
··iLoveVeryLongQueryNames(␊
····longArg1:·"string"␊
····anotherArg:·123␊
····tooManyArgs:·true␊
··)·{␊
····field1␊
····field2·{␊
······nestedField1␊
······nestedField2·{␊
········doubleNestedField1␊
········doubleNestedField2·{␊
··········tripleNestedField1␊
········}␊
······}␊
····}␊
··}␊
}␊

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

{
  "GraphQL": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified
@@ -1,6 +1,10 @@
 {␊
-··iLoveVeryLongQueryNames(longArg1:·"string",·anotherArg:·123,·tooManyArgs:·true)·{␊
+··iLoveVeryLongQueryNames(␊
+····longArg1:·"string"␊
+····anotherArg:·123␊
+····tooManyArgs:·true␊
+··)·{␊
 ····field1␊
 ····field2·{␊
 ······nestedField1␊
 ······nestedField2·{␊
@@ -10,5 +14,5 @@
 ········}␊
 ······}␊
 ····}␊
 ··}␊
-}
\ No newline at end of file
+}␊

🔧 80

Using Prettier beautifier:

{␊
··iLoveVeryLongQueryNames(␊
····longArg1:·"string"␊
····anotherArg:·123␊
····tooManyArgs:·true␊
··)·{␊
····field1␊
····field2·{␊
······nestedField1␊
······nestedField2·{␊
········doubleNestedField1␊
········doubleNestedField2·{␊
··········tripleNestedField1␊
········}␊
······}␊
····}␊
··}␊
}␊

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

{
  "GraphQL": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified
@@ -1,6 +1,10 @@
 {␊
-··iLoveVeryLongQueryNames(longArg1:·"string",·anotherArg:·123,·tooManyArgs:·true)·{␊
+··iLoveVeryLongQueryNames(␊
+····longArg1:·"string"␊
+····anotherArg:·123␊
+····tooManyArgs:·true␊
+··)·{␊
 ····field1␊
 ····field2·{␊
 ······nestedField1␊
 ······nestedField2·{␊
@@ -10,5 +14,5 @@
 ········}␊
 ······}␊
 ····}␊
 ··}␊
-}
\ No newline at end of file
+}␊

🔧 120

Using Prettier beautifier:

{␊
··iLoveVeryLongQueryNames(longArg1:·"string",·anotherArg:·123,·tooManyArgs:·true)·{␊
····field1␊
····field2·{␊
······nestedField1␊
······nestedField2·{␊
········doubleNestedField1␊
········doubleNestedField2·{␊
··········tripleNestedField1␊
········}␊
······}␊
····}␊
··}␊
}␊

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

{
  "GraphQL": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified
@@ -10,5 +10,5 @@
 ········}␊
 ······}␊
 ····}␊
 ··}␊
-}
\ No newline at end of file
+}␊

🔧 160

Using Prettier beautifier:

{␊
··iLoveVeryLongQueryNames(longArg1:·"string",·anotherArg:·123,·tooManyArgs:·true)·{␊
····field1␊
····field2·{␊
······nestedField1␊
······nestedField2·{␊
········doubleNestedField1␊
········doubleNestedField2·{␊
··········tripleNestedField1␊
········}␊
······}␊
····}␊
··}␊
}␊

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

{
  "GraphQL": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified
@@ -10,5 +10,5 @@
 ········}␊
 ······}␊
 ····}␊
 ··}␊
-}
\ No newline at end of file
+}␊

Edit HTML Example

🚧 Original Code

<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊

🔧 0

Using JS-Beautify beautifier:

<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>

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

{
  "HTML": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified
@@ -1,1 +1,1 @@
-<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊
+<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>
\ No newline at end of file

🔧 40

Using JS-Beautify beautifier:

<div>Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.</div>

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

{
  "HTML": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified
@@ -1,1 +1,8 @@
-<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊
+<div>Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.</div>
\ No newline at end of file

🔧 80

Using JS-Beautify beautifier:

<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at·all.</div>

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

{
  "HTML": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified
@@ -1,1 +1,4 @@
-<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊
+<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at·all.</div>
\ No newline at end of file

🔧 120

Using JS-Beautify beautifier:

<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at·all.</div>

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

{
  "HTML": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified
@@ -1,1 +1,3 @@
-<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊
+<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at·all.</div>
\ No newline at end of file

🔧 160

Using JS-Beautify beautifier:

<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.␊
··Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>

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

{
  "HTML": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified
@@ -1,1 +1,2 @@
-<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊
+<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.␊
+··Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>
\ No newline at end of file

Edit HTML+ERB Example

🚧 Original Code

<%·content_for·:page_title·do·%>␊
Ruby·on·Rails·Guides␊
<%·end·%>␊
␊
<%·content_for·:header_section·do·%>␊
<%=·render·'welcome'·%>␊
<%·end·%>␊
␊
<%·content_for·:index_section·do·%>␊
<div·id="subCol">␊
<dl>␊
<dt></dt>␊
<%·unless·@edge·-%>␊
<dd·class="kindle">Rails·Guides·are·also·available·for·<%=·link_to·'Kindle',·@mobi·%>.</dd>␊
<%·end·-%>␊
<dd·class="work-in-progress">Guides·marked·with·this·icon·are·currently·being·worked·on·and·will·not·be·available·in·the·Guides·Index·menu.·While·still·useful,·they·may·contain·incomplete·information·and·even·errors.·You·can·help·by·reviewing·them·and·posting·your·comments·and·corrections.</dd>␊
</dl>␊
</div>␊
<%·end·%>␊
␊
<%·documents_by_section.each·do·|section|·%>␊
<h3><%=·section['name']·%></h3>␊
<dl>␊
<%·section['documents'].each·do·|document|·%>␊
<%=·guide(document['name'],·document['url'],·work_in_progress:·document['work_in_progress'])·do·%>␊
<p><%=·document['description']·%></p>␊
<%·end·%>␊
<%·end·%>␊
</dl>␊
<%·end·%>

🔧 0

Using Pretty Diff beautifier:

<%·content_for·:page_title·do·%>␊
··Ruby·on·Rails·Guides␊
<%·end·%>␊
␊
<%·content_for·:header_section·do·%>␊
··<%=·render·'welcome'·%>␊
<%·end·%>␊
␊
<%·content_for·:index_section·do·%>␊
··<div·id="subCol">␊
····<dl>␊
······<dt></dt>␊
······<%·unless·@edge·-%>␊
········<dd·class="kindle">Rails·Guides·are·also·available·for␊
··········<%=·link_to·'Kindle',·@mobi·%>.</dd>␊
······<%·end·-%>␊
······<dd·class="work-in-progress">Guides·marked·with·this·icon·are·currently·being·worked·on·and·will·not·be·available·in·the·Guides·Index·menu.·While·still·useful,·they·may·contain·incomplete·information·and·even·errors.·You·can·help·by·reviewing·them·and·posting·your·comments·and·corrections.</dd>␊
····</dl>␊
··</div>␊
<%·end·%>␊
␊
<%·documents_by_section.each·do·|section|·%>␊
··<h3><%=·section['name']·%></h3>␊
··<dl>␊
····<%·section['documents'].each·do·|document|·%>␊
······<%=·guide(document['name'],·document['url'],·work_in_progress:·document['work_in_progress'])·do·%>␊
······<p><%=·document['description']·%></p>␊
····<%·end·%>␊
··<%·end·%>␊
</dl>␊
<%·end·%>

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

{
  "HTML+ERB": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified
@@ -1,30 +1,31 @@
 <%·content_for·:page_title·do·%>␊
-Ruby·on·Rails·Guides␊
+··Ruby·on·Rails·Guides␊
 <%·end·%>␊
 ␊
 <%·content_for·:header_section·do·%>␊
-<%=·render·'welcome'·%>␊
+··<%=·render·'welcome'·%>␊
 <%·end·%>␊
 ␊
 <%·content_for·:index_section·do·%>␊
-<div·id="subCol">␊
-<dl>␊
-<dt></dt>␊
-<%·unless·@edge·-%>␊
-<dd·class="kindle">Rails·Guides·are·also·available·for·<%=·link_to·'Kindle',·@mobi·%>.</dd>␊
-<%·end·-%>␊
-<dd·class="work-in-progress">Guides·marked·with·this·icon·are·currently·being·worked·on·and·will·not·be·available·in·the·Guides·Index·menu.·While·still·useful,·they·may·contain·incomplete·information·and·even·errors.·You·can·help·by·reviewing·them·and·posting·your·comments·and·corrections.</dd>␊
-</dl>␊
-</div>␊
+··<div·id="subCol">␊
+····<dl>␊
+······<dt></dt>␊
+······<%·unless·@edge·-%>␊
+········<dd·class="kindle">Rails·Guides·are·also·available·for␊
+··········<%=·link_to·'Kindle',·@mobi·%>.</dd>␊
+······<%·end·-%>␊
+······<dd·class="work-in-progress">Guides·marked·with·this·icon·are·currently·being·worked·on·and·will·not·be·available·in·the·Guides·Index·menu.·While·still·useful,·they·may·contain·incomplete·information·and·even·errors.·You·can·help·by·reviewing·them·and·posting·your·comments·and·corrections.</dd>␊
+····</dl>␊
+··</div>␊
 <%·end·%>␊
 ␊
 <%·documents_by_section.each·do·|section|·%>␊
-<h3><%=·section['name']·%></h3>␊
-<dl>␊
-<%·section['documents'].each·do·|document|·%>␊
-<%=·guide(document['name'],·document['url'],·work_in_progress:·document['work_in_progress'])·do·%>␊
-<p><%=·document['description']·%></p>␊
-<%·end·%>␊
-<%·end·%>␊
+··<h3><%=·section['name']·%></h3>␊
+··<dl>␊
+····<%·section['documents'].each·do·|document|·%>␊
+······<%=·guide(document['name'],·document['url'],·work_in_progress:·document['work_in_progress'])·do·%>␊
+······<p><%=·document['description']·%></p>␊
+····<%·end·%>␊
+··<%·end·%>␊
 </dl>␊
 <%·end·%>
\ No newline at end of file

🔧 40

Using Pretty Diff beautifier:

<%·content_for·:page_title·do·%>␊
··Ruby·on·Rails·Guides␊
<%·end·%>␊
␊
<%·content_for·:header_section·do·%>␊
··<%=·render·'welcome'·%>␊
<%·end·%>␊
␊
<%·content_for·:index_section·do·%>␊
··<div·id="subCol">␊
····<dl>␊
······<dt></dt>␊
······<%·unless·@edge·-%>␊
········<dd·class="kindle">Rails·Guides·are·also·available·for␊
··········<%=·link_to·'Kindle',·@mobi·%>.</dd>␊
······<%·end·-%>␊
······<dd·class="work-in-progress">Guides␊
········marked·with·this·icon·are·currently␊
········being·worked·on·and·will·not·be␊
········available·in·the·Guides·Index·menu.␊
········While·still·useful,·they·may·contain␊
········incomplete·information·and·even·errors.␊
········You·can·help·by·reviewing·them·and␊
········posting·your·comments·and·corrections.</dd>␊
····</dl>␊
··</div>␊
<%·end·%>␊
␊
<%·documents_by_section.each·do·|section|·%>␊
··<h3><%=·section['name']·%></h3>␊
··<dl>␊
····<%·section['documents'].each·do·|document|·%>␊
······<%=·guide(document['name'],␊
······document['url'],·work_in_progress:␊
······document['work_in_progress'])·do·%>␊
······<p><%=·document['description']·%></p>␊
····<%·end·%>␊
··<%·end·%>␊
</dl>␊
<%·end·%>

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

{
  "HTML+ERB": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified
@@ -1,30 +1,40 @@
 <%·content_for·:page_title·do·%>␊
-Ruby·on·Rails·Guides␊
+··Ruby·on·Rails·Guides␊
 <%·end·%>␊
 ␊
 <%·content_for·:header_section·do·%>␊
-<%=·render·'welcome'·%>␊
+··<%=·render·'welcome'·%>␊
 <%·end·%>␊
 ␊
 <%·content_for·:index_section·do·%>␊
-<div·id="subCol">␊
-<dl>␊
-<dt></dt>␊
-<%·unless·@edge·-%>␊
-<dd·class="kindle">Rails·Guides·are·also·available·for·<%=·link_to·'Kindle',·@mobi·%>.</dd>␊
-<%·end·-%>␊
-<dd·class="work-in-progress">Guides·marked·with·this·icon·are·currently·being·worked·on·and·will·not·be·available·in·the·Guides·Index·menu.·While·still·useful,·they·may·contain·incomplete·information·and·even·errors.·You·can·help·by·reviewing·them·and·posting·your·comments·and·corrections.</dd>␊
-</dl>␊
-</div>␊
+··<div·id="subCol">␊
+····<dl>␊
+······<dt></dt>␊
+······<%·unless·@edge·-%>␊
+········<dd·class="kindle">Rails·Guides·are·also·available·for␊
+··········<%=·link_to·'Kindle',·@mobi·%>.</dd>␊
+······<%·end·-%>␊
+······<dd·class="work-in-progress">Guides␊
+········marked·with·this·icon·are·currently␊
+········being·worked·on·and·will·not·be␊
+········available·in·the·Guides·Index·menu.␊
+········While·still·useful,·they·may·contain␊
+········incomplete·information·and·even·errors.␊
+········You·can·help·by·reviewing·them·and␊
+········posting·your·comments·and·corrections.</dd>␊
+····</dl>␊
+··</div>␊
 <%·end·%>␊
 ␊
 <%·documents_by_section.each·do·|section|·%>␊
-<h3><%=·section['name']·%></h3>␊
-<dl>␊
-<%·section['documents'].each·do·|document|·%>␊
-<%=·guide(document['name'],·document['url'],·work_in_progress:·document['work_in_progress'])·do·%>␊
-<p><%=·document['description']·%></p>␊
-<%·end·%>␊
-<%·end·%>␊
+··<h3><%=·section['name']·%></h3>␊
+··<dl>␊
+····<%·section['documents'].each·do·|document|·%>␊
+······<%=·guide(document['name'],␊
+······document['url'],·work_in_progress:␊
+······document['work_in_progress'])·do·%>␊
+······<p><%=·document['description']·%></p>␊
+····<%·end·%>␊
+··<%·end·%>␊
 </dl>␊
 <%·end·%>
\ No newline at end of file

🔧 80

Using Pretty Diff beautifier:

<%·content_for·:page_title·do·%>␊
··Ruby·on·Rails·Guides␊
<%·end·%>␊
␊
<%·content_for·:header_section·do·%>␊
··<%=·render·'welcome'·%>␊
<%·end·%>␊
␊
<%·content_for·:index_section·do·%>␊
··<div·id="subCol">␊
····<dl>␊
······<dt></dt>␊
······<%·unless·@edge·-%>␊
········<dd·class="kindle">Rails·Guides·are·also·available·for␊
··········<%=·link_to·'Kindle',·@mobi·%>.</dd>␊
······<%·end·-%>␊
······<dd·class="work-in-progress">Guides·marked·with·this·icon·are·currently·being␊
········worked·on·and·will·not·be·available·in·the·Guides·Index·menu.·While·still␊
········useful,·they·may·contain·incomplete·information·and·even·errors.·You·can·help·by␊
········reviewing·them·and·posting·your·comments·and·corrections.</dd>␊
····</dl>␊
··</div>␊
<%·end·%>␊
␊
<%·documents_by_section.each·do·|section|·%>␊
··<h3><%=·section['name']·%></h3>␊
··<dl>␊
····<%·section['documents'].each·do·|document|·%>␊
······<%=·guide(document['name'],·document['url'],·work_in_progress:␊
······document['work_in_progress'])·do·%>␊
······<p><%=·document['description']·%></p>␊
····<%·end·%>␊
··<%·end·%>␊
</dl>␊
<%·end·%>

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

{
  "HTML+ERB": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified
@@ -1,30 +1,35 @@
 <%·content_for·:page_title·do·%>␊
-Ruby·on·Rails·Guides␊
+··Ruby·on·Rails·Guides␊
 <%·end·%>␊
 ␊
 <%·content_for·:header_section·do·%>␊
-<%=·render·'welcome'·%>␊
+··<%=·render·'welcome'·%>␊
 <%·end·%>␊
 ␊
 <%·content_for·:index_section·do·%>␊
-<div·id="subCol">␊
-<dl>␊
-<dt></dt>␊
-<%·unless·@edge·-%>␊
-<dd·class="kindle">Rails·Guides·are·also·available·for·<%=·link_to·'Kindle',·@mobi·%>.</dd>␊
-<%·end·-%>␊
-<dd·class="work-in-progress">Guides·marked·with·this·icon·are·currently·being·worked·on·and·will·not·be·available·in·the·Guides·Index·menu.·While·still·useful,·they·may·contain·incomplete·information·and·even·errors.·You·can·help·by·reviewing·them·and·posting·your·comments·and·corrections.</dd>␊
-</dl>␊
-</div>␊
+··<div·id="subCol">␊
+····<dl>␊
+······<dt></dt>␊
+······<%·unless·@edge·-%>␊
+········<dd·class="kindle">Rails·Guides·are·also·available·for␊
+··········<%=·link_to·'Kindle',·@mobi·%>.</dd>␊
+······<%·end·-%>␊
+······<dd·class="work-in-progress">Guides·marked·with·this·icon·are·currently·being␊
+········worked·on·and·will·not·be·available·in·the·Guides·Index·menu.·While·still␊
+········useful,·they·may·contain·incomplete·information·and·even·errors.·You·can·help·by␊
+········reviewing·them·and·posting·your·comments·and·corrections.</dd>␊
+····</dl>␊
+··</div>␊
 <%·end·%>␊
 ␊
 <%·documents_by_section.each·do·|section|·%>␊
-<h3><%=·section['name']·%></h3>␊
-<dl>␊
-<%·section['documents'].each·do·|document|·%>␊
-<%=·guide(document['name'],·document['url'],·work_in_progress:·document['work_in_progress'])·do·%>␊
-<p><%=·document['description']·%></p>␊
-<%·end·%>␊
-<%·end·%>␊
+··<h3><%=·section['name']·%></h3>␊
+··<dl>␊
+····<%·section['documents'].each·do·|document|·%>␊
+······<%=·guide(document['name'],·document['url'],·work_in_progress:␊
+······document['work_in_progress'])·do·%>␊
+······<p><%=·document['description']·%></p>␊
+····<%·end·%>␊
+··<%·end·%>␊
 </dl>␊
 <%·end·%>
\ No newline at end of file

🔧 120

Using Pretty Diff beautifier:

<%·content_for·:page_title·do·%>␊
··Ruby·on·Rails·Guides␊
<%·end·%>␊
␊
<%·content_for·:header_section·do·%>␊
··<%=·render·'welcome'·%>␊
<%·end·%>␊
␊
<%·content_for·:index_section·do·%>␊
··<div·id="subCol">␊
····<dl>␊
······<dt></dt>␊
······<%·unless·@edge·-%>␊
········<dd·class="kindle">Rails·Guides·are·also·available·for␊
··········<%=·link_to·'Kindle',·@mobi·%>.</dd>␊
······<%·end·-%>␊
······<dd·class="work-in-progress">Guides·marked·with·this·icon·are·currently·being·worked·on·and·will·not·be·available·in·the␊
········Guides·Index·menu.·While·still·useful,·they·may·contain·incomplete·information·and·even·errors.·You·can·help·by␊
········reviewing·them·and·posting·your·comments·and·corrections.</dd>␊
····</dl>␊
··</div>␊
<%·end·%>␊
␊
<%·documents_by_section.each·do·|section|·%>␊
··<h3><%=·section['name']·%></h3>␊
··<dl>␊
····<%·section['documents'].each·do·|document|·%>␊
······<%=·guide(document['name'],·document['url'],·work_in_progress:·document['work_in_progress'])·do·%>␊
······<p><%=·document['description']·%></p>␊
····<%·end·%>␊
··<%·end·%>␊
</dl>␊
<%·end·%>

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

{
  "HTML+ERB": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified
@@ -1,30 +1,33 @@
 <%·content_for·:page_title·do·%>␊
-Ruby·on·Rails·Guides␊
+··Ruby·on·Rails·Guides␊
 <%·end·%>␊
 ␊
 <%·content_for·:header_section·do·%>␊
-<%=·render·'welcome'·%>␊
+··<%=·render·'welcome'·%>␊
 <%·end·%>␊
 ␊
 <%·content_for·:index_section·do·%>␊
-<div·id="subCol">␊
-<dl>␊
-<dt></dt>␊
-<%·unless·@edge·-%>␊
-<dd·class="kindle">Rails·Guides·are·also·available·for·<%=·link_to·'Kindle',·@mobi·%>.</dd>␊
-<%·end·-%>␊
-<dd·class="work-in-progress">Guides·marked·with·this·icon·are·currently·being·worked·on·and·will·not·be·available·in·the·Guides·Index·menu.·While·still·useful,·they·may·contain·incomplete·information·and·even·errors.·You·can·help·by·reviewing·them·and·posting·your·comments·and·corrections.</dd>␊
-</dl>␊
-</div>␊
+··<div·id="subCol">␊
+····<dl>␊
+······<dt></dt>␊
+······<%·unless·@edge·-%>␊
+········<dd·class="kindle">Rails·Guides·are·also·available·for␊
+··········<%=·link_to·'Kindle',·@mobi·%>.</dd>␊
+······<%·end·-%>␊
+······<dd·class="work-in-progress">Guides·marked·with·this·icon·are·currently·being·worked·on·and·will·not·be·available·in·the␊
+········Guides·Index·menu.·While·still·useful,·they·may·contain·incomplete·information·and·even·errors.·You·can·help·by␊
+········reviewing·them·and·posting·your·comments·and·corrections.</dd>␊
+····</dl>␊
+··</div>␊
 <%·end·%>␊
 ␊
 <%·documents_by_section.each·do·|section|·%>␊
-<h3><%=·section['name']·%></h3>␊
-<dl>␊
-<%·section['documents'].each·do·|document|·%>␊
-<%=·guide(document['name'],·document['url'],·work_in_progress:·document['work_in_progress'])·do·%>␊
-<p><%=·document['description']·%></p>␊
-<%·end·%>␊
-<%·end·%>␊
+··<h3><%=·section['name']·%></h3>␊
+··<dl>␊
+····<%·section['documents'].each·do·|document|·%>␊
+······<%=·guide(document['name'],·document['url'],·work_in_progress:·document['work_in_progress'])·do·%>␊
+······<p><%=·document['description']·%></p>␊
+····<%·end·%>␊
+··<%·end·%>␊
 </dl>␊
 <%·end·%>
\ No newline at end of file

🔧 160

Using Pretty Diff beautifier:

<%·content_for·:page_title·do·%>␊
··Ruby·on·Rails·Guides␊
<%·end·%>␊
␊
<%·content_for·:header_section·do·%>␊
··<%=·render·'welcome'·%>␊
<%·end·%>␊
␊
<%·content_for·:index_section·do·%>␊
··<div·id="subCol">␊
····<dl>␊
······<dt></dt>␊
······<%·unless·@edge·-%>␊
········<dd·class="kindle">Rails·Guides·are·also·available·for␊
··········<%=·link_to·'Kindle',·@mobi·%>.</dd>␊
······<%·end·-%>␊
······<dd·class="work-in-progress">Guides·marked·with·this·icon·are·currently·being·worked·on·and·will·not·be·available·in·the·Guides·Index·menu.·While·still·useful,␊
········they·may·contain·incomplete·information·and·even·errors.·You·can·help·by·reviewing·them·and·posting·your·comments·and·corrections.</dd>␊
····</dl>␊
··</div>␊
<%·end·%>␊
␊
<%·documents_by_section.each·do·|section|·%>␊
··<h3><%=·section['name']·%></h3>␊
··<dl>␊
····<%·section['documents'].each·do·|document|·%>␊
······<%=·guide(document['name'],·document['url'],·work_in_progress:·document['work_in_progress'])·do·%>␊
······<p><%=·document['description']·%></p>␊
····<%·end·%>␊
··<%·end·%>␊
</dl>␊
<%·end·%>

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

{
  "HTML+ERB": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified
@@ -1,30 +1,32 @@
 <%·content_for·:page_title·do·%>␊
-Ruby·on·Rails·Guides␊
+··Ruby·on·Rails·Guides␊
 <%·end·%>␊
 ␊
 <%·content_for·:header_section·do·%>␊
-<%=·render·'welcome'·%>␊
+··<%=·render·'welcome'·%>␊
 <%·end·%>␊
 ␊
 <%·content_for·:index_section·do·%>␊
-<div·id="subCol">␊
-<dl>␊
-<dt></dt>␊
-<%·unless·@edge·-%>␊
-<dd·class="kindle">Rails·Guides·are·also·available·for·<%=·link_to·'Kindle',·@mobi·%>.</dd>␊
-<%·end·-%>␊
-<dd·class="work-in-progress">Guides·marked·with·this·icon·are·currently·being·worked·on·and·will·not·be·available·in·the·Guides·Index·menu.·While·still·useful,·they·may·contain·incomplete·information·and·even·errors.·You·can·help·by·reviewing·them·and·posting·your·comments·and·corrections.</dd>␊
-</dl>␊
-</div>␊
+··<div·id="subCol">␊
+····<dl>␊
+······<dt></dt>␊
+······<%·unless·@edge·-%>␊
+········<dd·class="kindle">Rails·Guides·are·also·available·for␊
+··········<%=·link_to·'Kindle',·@mobi·%>.</dd>␊
+······<%·end·-%>␊
+······<dd·class="work-in-progress">Guides·marked·with·this·icon·are·currently·being·worked·on·and·will·not·be·available·in·the·Guides·Index·menu.·While·still·useful,␊
+········they·may·contain·incomplete·information·and·even·errors.·You·can·help·by·reviewing·them·and·posting·your·comments·and·corrections.</dd>␊
+····</dl>␊
+··</div>␊
 <%·end·%>␊
 ␊
 <%·documents_by_section.each·do·|section|·%>␊
-<h3><%=·section['name']·%></h3>␊
-<dl>␊
-<%·section['documents'].each·do·|document|·%>␊
-<%=·guide(document['name'],·document['url'],·work_in_progress:·document['work_in_progress'])·do·%>␊
-<p><%=·document['description']·%></p>␊
-<%·end·%>␊
-<%·end·%>␊
+··<h3><%=·section['name']·%></h3>␊
+··<dl>␊
+····<%·section['documents'].each·do·|document|·%>␊
+······<%=·guide(document['name'],·document['url'],·work_in_progress:·document['work_in_progress'])·do·%>␊
+······<p><%=·document['description']·%></p>␊
+····<%·end·%>␊
+··<%·end·%>␊
 </dl>␊
 <%·end·%>
\ No newline at end of file

Add Handlebars Example

No example found. Please submit a Pull Request!

Edit JSX Example

🚧 Original Code

function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
····console.log("");␊
}␊

🔧 0

Using Prettier beautifier:

function·iLoveVeryLongRunOnFunctioNames(␊
··longArg1,␊
··anotherArg,␊
··tooManyArgs␊
)·{␊
··console.log(␊
····""␊
··);␊
}␊

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

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified
@@ -1,3 +1,9 @@
-function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
-····console.log("");␊
+function·iLoveVeryLongRunOnFunctioNames(␊
+··longArg1,␊
+··anotherArg,␊
+··tooManyArgs␊
+)·{␊
+··console.log(␊
+····""␊
+··);␊
 }␊

🔧 40

Using Prettier beautifier:

function·iLoveVeryLongRunOnFunctioNames(␊
··longArg1,␊
··anotherArg,␊
··tooManyArgs␊
)·{␊
··console.log("");␊
}␊

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

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified
@@ -1,3 +1,7 @@
-function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
-····console.log("");␊
+function·iLoveVeryLongRunOnFunctioNames(␊
+··longArg1,␊
+··anotherArg,␊
+··tooManyArgs␊
+)·{␊
+··console.log("");␊
 }␊

🔧 80

Using Prettier beautifier:

function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
··console.log("");␊
}␊

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

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified
@@ -1,3 +1,3 @@
 function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
-····console.log("");␊
+··console.log("");␊
 }␊

🔧 120

Using Prettier beautifier:

function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
··console.log("");␊
}␊

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

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified
@@ -1,3 +1,3 @@
 function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
-····console.log("");␊
+··console.log("");␊
 }␊

🔧 160

Using Prettier beautifier:

function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
··console.log("");␊
}␊

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

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified
@@ -1,3 +1,3 @@
 function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
-····console.log("");␊
+··console.log("");␊
 }␊

Edit Java Example

🚧 Original Code

public·class·HelloWorld·{␊
␊
····public·static·void·main(String[]·args)·{␊
········//·Prints·"Hello,·World"·to·the·terminal·window.␊
········System.out.println("Hello,·World");␊
␊
········//·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
········This.is.a.really.really.very.extremely.terrible.unbearably.long.method.chain("Hello,·World");␊
␊
····}␊
␊
}␊

🔧 0

Using Pretty Diff beautifier:

public·class·HelloWorld·{␊
␊
··public·static·void·main(String[]·args)·{␊
····//·Prints·"Hello,·World"·to·the·terminal·window.␊
····System.out.println("Hello,·World");␊
␊
····//·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
····This.is.a.really.really.very.extremely.terrible.unbearably.long.method.chain("Hello,·World");␊
␊
··}␊
␊
}␊

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

{
  "Java": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified
@@ -1,12 +1,12 @@
 public·class·HelloWorld·{␊
 ␊
-····public·static·void·main(String[]·args)·{␊
-········//·Prints·"Hello,·World"·to·the·terminal·window.␊
-········System.out.println("Hello,·World");␊
+··public·static·void·main(String[]·args)·{␊
+····//·Prints·"Hello,·World"·to·the·terminal·window.␊
+····System.out.println("Hello,·World");␊
 ␊
-········//·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
-········This.is.a.really.really.very.extremely.terrible.unbearably.long.method.chain("Hello,·World");␊
+····//·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
+····This.is.a.really.really.very.extremely.terrible.unbearably.long.method.chain("Hello,·World");␊
 ␊
-····}␊
+··}␊
 ␊
 }␊

🔧 40

Using Pretty Diff beautifier:

public·class·HelloWorld·{␊
␊
··public·static·void·main(String[]·args)·{␊
····//·Prints·"Hello,·World"·to·the·terminal␊
····//·window.␊
····System.out.println("Hello,·World");␊
␊
····//·Wrap·markdown·text·to·new·lines.·Wrap␊
····//·markdown·text·to·new·lines.·Wrap␊
····//·markdown·text·to·new·lines.·Wrap␊
····//·markdown·text·to·new·lines.·Wrap␊
····//·markdown·text·to·new·lines.·Wrap␊
····//·markdown·text·to·new·lines.·Wrap␊
····//·markdown·text·to·new·lines.·Wrap␊
····//·markdown·text·to·new·lines.␊
····This.is.a.really.really.very.extremely.terrible.unbearably.long.method.chain(␊
······"Hello,·World"␊
····);␊
␊
··}␊
␊
}␊

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

{
  "Java": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified
@@ -1,12 +1,22 @@
 public·class·HelloWorld·{␊
 ␊
-····public·static·void·main(String[]·args)·{␊
-········//·Prints·"Hello,·World"·to·the·terminal·window.␊
-········System.out.println("Hello,·World");␊
+··public·static·void·main(String[]·args)·{␊
+····//·Prints·"Hello,·World"·to·the·terminal␊
+····//·window.␊
+····System.out.println("Hello,·World");␊
 ␊
-········//·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
-········This.is.a.really.really.very.extremely.terrible.unbearably.long.method.chain("Hello,·World");␊
+····//·Wrap·markdown·text·to·new·lines.·Wrap␊
+····//·markdown·text·to·new·lines.·Wrap␊
+····//·markdown·text·to·new·lines.·Wrap␊
+····//·markdown·text·to·new·lines.·Wrap␊
+····//·markdown·text·to·new·lines.·Wrap␊
+····//·markdown·text·to·new·lines.·Wrap␊
+····//·markdown·text·to·new·lines.·Wrap␊
+····//·markdown·text·to·new·lines.␊
+····This.is.a.really.really.very.extremely.terrible.unbearably.long.method.chain(␊
+······"Hello,·World"␊
+····);␊
 ␊
-····}␊
+··}␊
 ␊
 }␊

🔧 80

Using Pretty Diff beautifier:

public·class·HelloWorld·{␊
␊
··public·static·void·main(String[]·args)·{␊
····//·Prints·"Hello,·World"·to·the·terminal·window.␊
····System.out.println("Hello,·World");␊
␊
····//·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap␊
····//·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown␊
····//·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new␊
····//·lines.·Wrap·markdown·text·to·new·lines.␊
····This.is.a.really.really.very.extremely.terrible.unbearably.long.method.chain(␊
······"Hello,·World"␊
····);␊
␊
··}␊
␊
}␊

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

{
  "Java": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified
@@ -1,12 +1,17 @@
 public·class·HelloWorld·{␊
 ␊
-····public·static·void·main(String[]·args)·{␊
-········//·Prints·"Hello,·World"·to·the·terminal·window.␊
-········System.out.println("Hello,·World");␊
+··public·static·void·main(String[]·args)·{␊
+····//·Prints·"Hello,·World"·to·the·terminal·window.␊
+····System.out.println("Hello,·World");␊
 ␊
-········//·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
-········This.is.a.really.really.very.extremely.terrible.unbearably.long.method.chain("Hello,·World");␊
+····//·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap␊
+····//·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown␊
+····//·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new␊
+····//·lines.·Wrap·markdown·text·to·new·lines.␊
+····This.is.a.really.really.very.extremely.terrible.unbearably.long.method.chain(␊
+······"Hello,·World"␊
+····);␊
 ␊
-····}␊
+··}␊
 ␊
 }␊

🔧 120

Using Pretty Diff beautifier:

public·class·HelloWorld·{␊
␊
··public·static·void·main(String[]·args)·{␊
····//·Prints·"Hello,·World"·to·the·terminal·window.␊
····System.out.println("Hello,·World");␊
␊
····//·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text␊
····//·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap␊
····//·markdown·text·to·new·lines.␊
····This.is.a.really.really.very.extremely.terrible.unbearably.long.method.chain("Hello,·World");␊
␊
··}␊
␊
}␊

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

{
  "Java": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified
@@ -1,12 +1,14 @@
 public·class·HelloWorld·{␊
 ␊
-····public·static·void·main(String[]·args)·{␊
-········//·Prints·"Hello,·World"·to·the·terminal·window.␊
-········System.out.println("Hello,·World");␊
+··public·static·void·main(String[]·args)·{␊
+····//·Prints·"Hello,·World"·to·the·terminal·window.␊
+····System.out.println("Hello,·World");␊
 ␊
-········//·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
-········This.is.a.really.really.very.extremely.terrible.unbearably.long.method.chain("Hello,·World");␊
+····//·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text␊
+····//·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap␊
+····//·markdown·text·to·new·lines.␊
+····This.is.a.really.really.very.extremely.terrible.unbearably.long.method.chain("Hello,·World");␊
 ␊
-····}␊
+··}␊
 ␊
 }␊

🔧 160

Using Pretty Diff beautifier:

public·class·HelloWorld·{␊
␊
··public·static·void·main(String[]·args)·{␊
····//·Prints·"Hello,·World"·to·the·terminal·window.␊
····System.out.println("Hello,·World");␊
␊
····//·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new␊
····//·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
····This.is.a.really.really.very.extremely.terrible.unbearably.long.method.chain("Hello,·World");␊
␊
··}␊
␊
}␊

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

{
  "Java": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified
@@ -1,12 +1,13 @@
 public·class·HelloWorld·{␊
 ␊
-····public·static·void·main(String[]·args)·{␊
-········//·Prints·"Hello,·World"·to·the·terminal·window.␊
-········System.out.println("Hello,·World");␊
+··public·static·void·main(String[]·args)·{␊
+····//·Prints·"Hello,·World"·to·the·terminal·window.␊
+····System.out.println("Hello,·World");␊
 ␊
-········//·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
-········This.is.a.really.really.very.extremely.terrible.unbearably.long.method.chain("Hello,·World");␊
+····//·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new␊
+····//·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
+····This.is.a.really.really.very.extremely.terrible.unbearably.long.method.chain("Hello,·World");␊
 ␊
-····}␊
+··}␊
 ␊
 }␊

Edit JavaScript Example

🚧 Original Code

function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
····console.log("");␊
}␊

🔧 0

Using Prettier beautifier:

function·iLoveVeryLongRunOnFunctioNames(␊
··longArg1,␊
··anotherArg,␊
··tooManyArgs␊
)·{␊
··console.log(␊
····""␊
··);␊
}␊

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

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified
@@ -1,3 +1,9 @@
-function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
-····console.log("");␊
+function·iLoveVeryLongRunOnFunctioNames(␊
+··longArg1,␊
+··anotherArg,␊
+··tooManyArgs␊
+)·{␊
+··console.log(␊
+····""␊
+··);␊
 }␊

🔧 40

Using Prettier beautifier:

function·iLoveVeryLongRunOnFunctioNames(␊
··longArg1,␊
··anotherArg,␊
··tooManyArgs␊
)·{␊
··console.log("");␊
}␊

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

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified
@@ -1,3 +1,7 @@
-function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
-····console.log("");␊
+function·iLoveVeryLongRunOnFunctioNames(␊
+··longArg1,␊
+··anotherArg,␊
+··tooManyArgs␊
+)·{␊
+··console.log("");␊
 }␊

🔧 80

Using Prettier beautifier:

function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
··console.log("");␊
}␊

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

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified
@@ -1,3 +1,3 @@
 function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
-····console.log("");␊
+··console.log("");␊
 }␊

🔧 120

Using Prettier beautifier:

function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
··console.log("");␊
}␊

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

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified
@@ -1,3 +1,3 @@
 function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
-····console.log("");␊
+··console.log("");␊
 }␊

🔧 160

Using Prettier beautifier:

function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
··console.log("");␊
}␊

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

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified
@@ -1,3 +1,3 @@
 function·iLoveVeryLongRunOnFunctioNames(longArg1,·anotherArg,·tooManyArgs)·{␊
-····console.log("");␊
+··console.log("");␊
 }␊

Edit Less Example

🚧 Original Code

.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

🔧 0

Using Prettier beautifier:

.fixedHeaderContainer.sticky␊
··header␊
··>·a␊
··img,␊
.separateOnPageNav␊
··.fixedHeaderContainer␊
··header␊
··>·a␊
··img·{␊
··height:·30px;␊
}␊

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

{
  "Less": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified
@@ -1,3 +1,11 @@
-.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
+.fixedHeaderContainer.sticky␊
+··header␊
+··>·a␊
+··img,␊
+.separateOnPageNav␊
+··.fixedHeaderContainer␊
+··header␊
+··>·a␊
+··img·{␊
 ··height:·30px;␊
 }␊

🔧 40

Using Prettier beautifier:

.fixedHeaderContainer.sticky␊
··header␊
··>·a␊
··img,␊
.separateOnPageNav␊
··.fixedHeaderContainer␊
··header␊
··>·a␊
··img·{␊
··height:·30px;␊
}␊

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

{
  "Less": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified
@@ -1,3 +1,11 @@
-.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
+.fixedHeaderContainer.sticky␊
+··header␊
+··>·a␊
+··img,␊
+.separateOnPageNav␊
+··.fixedHeaderContainer␊
+··header␊
+··>·a␊
+··img·{␊
 ··height:·30px;␊
 }␊

🔧 80

Using Prettier beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,␊
.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

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

{
  "Less": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified
@@ -1,3 +1,4 @@
-.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
+.fixedHeaderContainer.sticky·header·>·a·img,␊
+.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
 ··height:·30px;␊
 }␊

🔧 120

Using Prettier beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,␊
.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

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

{
  "Less": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified
@@ -1,3 +1,4 @@
-.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
+.fixedHeaderContainer.sticky·header·>·a·img,␊
+.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
 ··height:·30px;␊
 }␊

🔧 160

Using Prettier beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,␊
.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

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

{
  "Less": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified
@@ -1,3 +1,4 @@
-.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
+.fixedHeaderContainer.sticky·header·>·a·img,␊
+.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
 ··height:·30px;␊
 }␊

Add Liquid Example

No example found. Please submit a Pull Request!

Edit Markdown Example

🚧 Original Code

#·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
␊
Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
␊

🔧 0

Using Prettier beautifier:

#·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
␊
Wrap␊
markdown␊
text␊
to␊
new␊
lines.␊
Wrap␊
markdown␊
text␊
to␊
new␊
lines.␊
Wrap␊
markdown␊
text␊
to␊
new␊
lines.␊
Wrap␊
markdown␊
text␊
to␊
new␊
lines.␊
Wrap␊
markdown␊
text␊
to␊
new␊
lines.␊
Wrap␊
markdown␊
text␊
to␊
new␊
lines.␊
Wrap␊
markdown␊
text␊
to␊
new␊
lines.␊
Wrap␊
markdown␊
text␊
to␊
new␊
lines.␊

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

{
  "Markdown": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified
@@ -1,4 +1,50 @@
 #·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
 ␊
-Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
-␊
+Wrap␊
+markdown␊
+text␊
+to␊
+new␊
+lines.␊
+Wrap␊
+markdown␊
+text␊
+to␊
+new␊
+lines.␊
+Wrap␊
+markdown␊
+text␊
+to␊
+new␊
+lines.␊
+Wrap␊
+markdown␊
+text␊
+to␊
+new␊
+lines.␊
+Wrap␊
+markdown␊
+text␊
+to␊
+new␊
+lines.␊
+Wrap␊
+markdown␊
+text␊
+to␊
+new␊
+lines.␊
+Wrap␊
+markdown␊
+text␊
+to␊
+new␊
+lines.␊
+Wrap␊
+markdown␊
+text␊
+to␊
+new␊
+lines.␊

🔧 40

Using Prettier beautifier:

#·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
␊
Wrap·markdown·text·to·new·lines.·Wrap␊
markdown·text·to·new·lines.·Wrap␊
markdown·text·to·new·lines.·Wrap␊
markdown·text·to·new·lines.·Wrap␊
markdown·text·to·new·lines.·Wrap␊
markdown·text·to·new·lines.·Wrap␊
markdown·text·to·new·lines.·Wrap␊
markdown·text·to·new·lines.␊

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

{
  "Markdown": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified
@@ -1,4 +1,10 @@
 #·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
 ␊
-Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
-␊
+Wrap·markdown·text·to·new·lines.·Wrap␊
+markdown·text·to·new·lines.·Wrap␊
+markdown·text·to·new·lines.·Wrap␊
+markdown·text·to·new·lines.·Wrap␊
+markdown·text·to·new·lines.·Wrap␊
+markdown·text·to·new·lines.·Wrap␊
+markdown·text·to·new·lines.·Wrap␊
+markdown·text·to·new·lines.␊

🔧 80

Using Prettier beautifier:

#·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
␊
Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown␊
text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new␊
lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap␊
markdown·text·to·new·lines.␊

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

{
  "Markdown": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified
@@ -1,4 +1,6 @@
 #·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
 ␊
-Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
-␊
+Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown␊
+text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new␊
+lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap␊
+markdown·text·to·new·lines.␊

🔧 120

Using Prettier beautifier:

#·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
␊
Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to␊
new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap␊
markdown·text·to·new·lines.␊

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

{
  "Markdown": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified
@@ -1,4 +1,5 @@
 #·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
 ␊
-Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
-␊
+Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to␊
+new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap␊
+markdown·text·to·new·lines.␊

🔧 160

Using Prettier beautifier:

#·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
␊
Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new␊
lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊

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

{
  "Markdown": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified
@@ -1,4 +1,4 @@
 #·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
 ␊
-Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊
-␊
+Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new␊
+lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.·Wrap·markdown·text·to·new·lines.␊

Add Mustache Example

No example found. Please submit a Pull Request!

Edit Python Example

🚧 Original Code

l·=·[1,␊
·····2,␊
·····3,␊
]␊
␊
def·very_important_function(template:·str,·*variables,·file:·os.PathLike,·debug:·bool·=·False):␊
····"""Applies·`variables`·to·the·`template`·and·writes·to·`file`."""␊
····with·open(file,·'w')·as·f:␊
········TracebackException.from_exception(exc,·limit,·lookup_lines,·capture_locals)␊
········...␊

🔧 0

Using Black beautifier:

l·=·[␊
····1,␊
····2,␊
····3,␊
]␊
␊
␊
def·very_important_function(␊
····template:·str,·*variables,·file:·os.PathLike,·debug:·bool·=·False␊
):␊
····"""Applies·`variables`·to·the·`template`·and·writes·to·`file`."""␊
····with·open(file,·"w")·as·f:␊
········TracebackException.from_exception(exc,·limit,·lookup_lines,·capture_locals)␊
········...␊

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

{
  "Python": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "Black"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified
@@ -1,10 +1,14 @@
-l·=·[1,␊
-·····2,␊
-·····3,␊
+l·=·[␊
+····1,␊
+····2,␊
+····3,␊
 ]␊
 ␊
-def·very_important_function(template:·str,·*variables,·file:·os.PathLike,·debug:·bool·=·False):␊
+␊
+def·very_important_function(␊
+····template:·str,·*variables,·file:·os.PathLike,·debug:·bool·=·False␊
+):␊
 ····"""Applies·`variables`·to·the·`template`·and·writes·to·`file`."""␊
-····with·open(file,·'w')·as·f:␊
+····with·open(file,·"w")·as·f:␊
 ········TracebackException.from_exception(exc,·limit,·lookup_lines,·capture_locals)␊
 ········...␊

🔧 40

Using Black beautifier:

l·=·[␊
····1,␊
····2,␊
····3,␊
]␊
␊
␊
def·very_important_function(␊
····template:·str,␊
····*variables,␊
····file:·os.PathLike,␊
····debug:·bool·=·False␊
):␊
····"""Applies·`variables`·to·the·`template`·and·writes·to·`file`."""␊
····with·open(file,·"w")·as·f:␊
········TracebackException.from_exception(␊
············exc,␊
············limit,␊
············lookup_lines,␊
············capture_locals,␊
········)␊
········...␊

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

{
  "Python": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "Black"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified
@@ -1,10 +1,22 @@
-l·=·[1,␊
-·····2,␊
-·····3,␊
+l·=·[␊
+····1,␊
+····2,␊
+····3,␊
 ]␊
 ␊
-def·very_important_function(template:·str,·*variables,·file:·os.PathLike,·debug:·bool·=·False):␊
+␊
+def·very_important_function(␊
+····template:·str,␊
+····*variables,␊
+····file:·os.PathLike,␊
+····debug:·bool·=·False␊
+):␊
 ····"""Applies·`variables`·to·the·`template`·and·writes·to·`file`."""␊
-····with·open(file,·'w')·as·f:␊
-········TracebackException.from_exception(exc,·limit,·lookup_lines,·capture_locals)␊
+····with·open(file,·"w")·as·f:␊
+········TracebackException.from_exception(␊
+············exc,␊
+············limit,␊
+············lookup_lines,␊
+············capture_locals,␊
+········)␊
 ········...␊

🔧 80

Using Black beautifier:

l·=·[␊
····1,␊
····2,␊
····3,␊
]␊
␊
␊
def·very_important_function(␊
····template:·str,·*variables,·file:·os.PathLike,·debug:·bool·=·False␊
):␊
····"""Applies·`variables`·to·the·`template`·and·writes·to·`file`."""␊
····with·open(file,·"w")·as·f:␊
········TracebackException.from_exception(␊
············exc,·limit,·lookup_lines,·capture_locals␊
········)␊
········...␊

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

{
  "Python": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "Black"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified
@@ -1,10 +1,16 @@
-l·=·[1,␊
-·····2,␊
-·····3,␊
+l·=·[␊
+····1,␊
+····2,␊
+····3,␊
 ]␊
 ␊
-def·very_important_function(template:·str,·*variables,·file:·os.PathLike,·debug:·bool·=·False):␊
+␊
+def·very_important_function(␊
+····template:·str,·*variables,·file:·os.PathLike,·debug:·bool·=·False␊
+):␊
 ····"""Applies·`variables`·to·the·`template`·and·writes·to·`file`."""␊
-····with·open(file,·'w')·as·f:␊
-········TracebackException.from_exception(exc,·limit,·lookup_lines,·capture_locals)␊
+····with·open(file,·"w")·as·f:␊
+········TracebackException.from_exception(␊
+············exc,·limit,·lookup_lines,·capture_locals␊
+········)␊
 ········...␊

🔧 120

Using Black beautifier:

l·=·[␊
····1,␊
····2,␊
····3,␊
]␊
␊
␊
def·very_important_function(template:·str,·*variables,·file:·os.PathLike,·debug:·bool·=·False):␊
····"""Applies·`variables`·to·the·`template`·and·writes·to·`file`."""␊
····with·open(file,·"w")·as·f:␊
········TracebackException.from_exception(exc,·limit,·lookup_lines,·capture_locals)␊
········...␊

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

{
  "Python": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "Black"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified
@@ -1,10 +1,12 @@
-l·=·[1,␊
-·····2,␊
-·····3,␊
+l·=·[␊
+····1,␊
+····2,␊
+····3,␊
 ]␊
 ␊
+␊
 def·very_important_function(template:·str,·*variables,·file:·os.PathLike,·debug:·bool·=·False):␊
 ····"""Applies·`variables`·to·the·`template`·and·writes·to·`file`."""␊
-····with·open(file,·'w')·as·f:␊
+····with·open(file,·"w")·as·f:␊
 ········TracebackException.from_exception(exc,·limit,·lookup_lines,·capture_locals)␊
 ········...␊

🔧 160

Using Black beautifier:

l·=·[␊
····1,␊
····2,␊
····3,␊
]␊
␊
␊
def·very_important_function(template:·str,·*variables,·file:·os.PathLike,·debug:·bool·=·False):␊
····"""Applies·`variables`·to·the·`template`·and·writes·to·`file`."""␊
····with·open(file,·"w")·as·f:␊
········TracebackException.from_exception(exc,·limit,·lookup_lines,·capture_locals)␊
········...␊

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

{
  "Python": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "Black"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified
@@ -1,10 +1,12 @@
-l·=·[1,␊
-·····2,␊
-·····3,␊
+l·=·[␊
+····1,␊
+····2,␊
+····3,␊
 ]␊
 ␊
+␊
 def·very_important_function(template:·str,·*variables,·file:·os.PathLike,·debug:·bool·=·False):␊
 ····"""Applies·`variables`·to·the·`template`·and·writes·to·`file`."""␊
-····with·open(file,·'w')·as·f:␊
+····with·open(file,·"w")·as·f:␊
 ········TracebackException.from_exception(exc,·limit,·lookup_lines,·capture_locals)␊
 ········...␊

Add Riot Example

No example found. Please submit a Pull Request!

Edit SCSS Example

🚧 Original Code

.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

🔧 0

Using Prettier beautifier:

.fixedHeaderContainer.sticky␊
··header␊
··>·a␊
··img,␊
.separateOnPageNav␊
··.fixedHeaderContainer␊
··header␊
··>·a␊
··img·{␊
··height:·30px;␊
}␊

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

{
  "SCSS": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified
@@ -1,3 +1,11 @@
-.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
+.fixedHeaderContainer.sticky␊
+··header␊
+··>·a␊
+··img,␊
+.separateOnPageNav␊
+··.fixedHeaderContainer␊
+··header␊
+··>·a␊
+··img·{␊
 ··height:·30px;␊
 }␊

🔧 40

Using Prettier beautifier:

.fixedHeaderContainer.sticky␊
··header␊
··>·a␊
··img,␊
.separateOnPageNav␊
··.fixedHeaderContainer␊
··header␊
··>·a␊
··img·{␊
··height:·30px;␊
}␊

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

{
  "SCSS": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified
@@ -1,3 +1,11 @@
-.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
+.fixedHeaderContainer.sticky␊
+··header␊
+··>·a␊
+··img,␊
+.separateOnPageNav␊
+··.fixedHeaderContainer␊
+··header␊
+··>·a␊
+··img·{␊
 ··height:·30px;␊
 }␊

🔧 80

Using Prettier beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,␊
.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

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

{
  "SCSS": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified
@@ -1,3 +1,4 @@
-.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
+.fixedHeaderContainer.sticky·header·>·a·img,␊
+.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
 ··height:·30px;␊
 }␊

🔧 120

Using Prettier beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,␊
.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

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

{
  "SCSS": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified
@@ -1,3 +1,4 @@
-.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
+.fixedHeaderContainer.sticky·header·>·a·img,␊
+.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
 ··height:·30px;␊
 }␊

🔧 160

Using Prettier beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,␊
.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

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

{
  "SCSS": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified
@@ -1,3 +1,4 @@
-.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
+.fixedHeaderContainer.sticky·header·>·a·img,␊
+.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
 ··height:·30px;␊
 }␊

Add SVG Example

No example found. Please submit a Pull Request!

Edit Sass Example

🚧 Original Code

.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

🔧 0

Using stylelint beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

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

{
  "Sass": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified

🔧 40

Using stylelint beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

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

{
  "Sass": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified

🔧 80

Using stylelint beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

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

{
  "Sass": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified

🔧 120

Using stylelint beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

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

{
  "Sass": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified

🔧 160

Using stylelint beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img·{␊
··height:·30px;␊
}␊

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

{
  "Sass": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified

Add Spacebars Example

No example found. Please submit a Pull Request!

Edit SugarSS Example

🚧 Original Code

.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img␊
··height:·30px␊

🔧 0

Using stylelint beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img␊
··height:·30pxheaderaimg,.separateOnPageNav.fixedHeaderContainerheaderaimgheight␊

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

{
  "SugarSS": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified
@@ -1,2 +1,2 @@
 .fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img␊
-··height:·30px␊
+··height:·30pxheaderaimg,.separateOnPageNav.fixedHeaderContainerheaderaimgheight␊

🔧 40

Using stylelint beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img␊
··height:·30pxheaderaimg,.separateOnPageNav.fixedHeaderContainerheaderaimgheight␊

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

{
  "SugarSS": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified
@@ -1,2 +1,2 @@
 .fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img␊
-··height:·30px␊
+··height:·30pxheaderaimg,.separateOnPageNav.fixedHeaderContainerheaderaimgheight␊

🔧 80

Using stylelint beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img␊
··height:·30pxheaderaimg,.separateOnPageNav.fixedHeaderContainerheaderaimgheight␊

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

{
  "SugarSS": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified
@@ -1,2 +1,2 @@
 .fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img␊
-··height:·30px␊
+··height:·30pxheaderaimg,.separateOnPageNav.fixedHeaderContainerheaderaimgheight␊

🔧 120

Using stylelint beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img␊
··height:·30pxheaderaimg,.separateOnPageNav.fixedHeaderContainerheaderaimgheight␊

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

{
  "SugarSS": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified
@@ -1,2 +1,2 @@
 .fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img␊
-··height:·30px␊
+··height:·30pxheaderaimg,.separateOnPageNav.fixedHeaderContainerheaderaimgheight␊

🔧 160

Using stylelint beautifier:

.fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img␊
··height:·30pxheaderaimg,.separateOnPageNav.fixedHeaderContainerheaderaimgheight␊

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

{
  "SugarSS": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified
@@ -1,2 +1,2 @@
 .fixedHeaderContainer.sticky·header·>·a·img,·.separateOnPageNav·.fixedHeaderContainer·header·>·a·img␊
-··height:·30px␊
+··height:·30pxheaderaimg,.separateOnPageNav.fixedHeaderContainerheaderaimgheight␊

Add Swig Example

No example found. Please submit a Pull Request!

Add Titanium Style Sheets 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

function·iLoveVeryLongRunOnFunctioNames(longArg1:·string,·anotherArg:·number,·tooManyArgs:·boolean)·{␊
····console.log("");␊
}␊

🔧 0

Using Prettier beautifier:

function·iLoveVeryLongRunOnFunctioNames(␊
··longArg1:·string,␊
··anotherArg:·number,␊
··tooManyArgs:·boolean␊
)·{␊
··console.log(␊
····""␊
··);␊
}␊

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

{
  "TypeScript": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified
@@ -1,3 +1,9 @@
-function·iLoveVeryLongRunOnFunctioNames(longArg1:·string,·anotherArg:·number,·tooManyArgs:·boolean)·{␊
-····console.log("");␊
+function·iLoveVeryLongRunOnFunctioNames(␊
+··longArg1:·string,␊
+··anotherArg:·number,␊
+··tooManyArgs:·boolean␊
+)·{␊
+··console.log(␊
+····""␊
+··);␊
 }␊

🔧 40

Using Prettier beautifier:

function·iLoveVeryLongRunOnFunctioNames(␊
··longArg1:·string,␊
··anotherArg:·number,␊
··tooManyArgs:·boolean␊
)·{␊
··console.log("");␊
}␊

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

{
  "TypeScript": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified
@@ -1,3 +1,7 @@
-function·iLoveVeryLongRunOnFunctioNames(longArg1:·string,·anotherArg:·number,·tooManyArgs:·boolean)·{␊
-····console.log("");␊
+function·iLoveVeryLongRunOnFunctioNames(␊
+··longArg1:·string,␊
+··anotherArg:·number,␊
+··tooManyArgs:·boolean␊
+)·{␊
+··console.log("");␊
 }␊

🔧 80

Using Prettier beautifier:

function·iLoveVeryLongRunOnFunctioNames(␊
··longArg1:·string,␊
··anotherArg:·number,␊
··tooManyArgs:·boolean␊
)·{␊
··console.log("");␊
}␊

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

{
  "TypeScript": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified
@@ -1,3 +1,7 @@
-function·iLoveVeryLongRunOnFunctioNames(longArg1:·string,·anotherArg:·number,·tooManyArgs:·boolean)·{␊
-····console.log("");␊
+function·iLoveVeryLongRunOnFunctioNames(␊
+··longArg1:·string,␊
+··anotherArg:·number,␊
+··tooManyArgs:·boolean␊
+)·{␊
+··console.log("");␊
 }␊

🔧 120

Using Prettier beautifier:

function·iLoveVeryLongRunOnFunctioNames(longArg1:·string,·anotherArg:·number,·tooManyArgs:·boolean)·{␊
··console.log("");␊
}␊

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

{
  "TypeScript": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified
@@ -1,3 +1,3 @@
 function·iLoveVeryLongRunOnFunctioNames(longArg1:·string,·anotherArg:·number,·tooManyArgs:·boolean)·{␊
-····console.log("");␊
+··console.log("");␊
 }␊

🔧 160

Using Prettier beautifier:

function·iLoveVeryLongRunOnFunctioNames(longArg1:·string,·anotherArg:·number,·tooManyArgs:·boolean)·{␊
··console.log("");␊
}␊

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

{
  "TypeScript": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified
@@ -1,3 +1,3 @@
 function·iLoveVeryLongRunOnFunctioNames(longArg1:·string,·anotherArg:·number,·tooManyArgs:·boolean)·{␊
-····console.log("");␊
+··console.log("");␊
 }␊

Add Visualforce Example

No example found. Please submit a Pull Request!

Edit XML Example

🚧 Original Code

<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊

🔧 0

Using JS-Beautify beautifier:

<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>

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

{
  "XML": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 0,
    "wrap_prose": "always",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: 0
===================================================================
--- 0   Original
+++ 0   Beautified
@@ -1,1 +1,1 @@
-<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊
+<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>
\ No newline at end of file

🔧 40

Using JS-Beautify beautifier:

<div>Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at␊
··all.</div>

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

{
  "XML": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 40,
    "wrap_prose": "always",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: 40
===================================================================
--- 40  Original
+++ 40  Beautified
@@ -1,1 +1,8 @@
-<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊
+<div>Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at␊
+··all.</div>
\ No newline at end of file

🔧 80

Using JS-Beautify beautifier:

<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at·all.</div>

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

{
  "XML": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 80,
    "wrap_prose": "always",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: 80
===================================================================
--- 80  Original
+++ 80  Beautified
@@ -1,1 +1,4 @@
-<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊
+<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at·all.</div>
\ No newline at end of file

🔧 120

Using JS-Beautify beautifier:

<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
··all.·Some·text·that·should·not·wrap·at·all.</div>

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

{
  "XML": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 120,
    "wrap_prose": "always",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: 120
===================================================================
--- 120 Original
+++ 120 Beautified
@@ -1,1 +1,3 @@
-<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊
+<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at␊
+··all.·Some·text·that·should·not·wrap·at·all.</div>
\ No newline at end of file

🔧 160

Using JS-Beautify beautifier:

<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.␊
··Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>

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

{
  "XML": {
    "indent_size": 2,
    "indent_char": " ",
    "wrap_line_length": 160,
    "wrap_prose": "always",
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: 160
===================================================================
--- 160 Original
+++ 160 Beautified
@@ -1,1 +1,2 @@
-<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>␊
+<div>Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.␊
+··Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.·Some·text·that·should·not·wrap·at·all.</div>
\ No newline at end of file

Add XTemplate Example

No example found. Please submit a Pull Request!

← Wrap Attributes Indent SizeWrap Prose →
  • 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