Quotes · Unibeautify

Config Key: quotes

Description: Convert the quote characters delimiting strings from either double or single quotes to the other.

Available since version: 0.7.0 (Current: )

Type: string

Default: "none"

Allowed values: "none" or "double" or "single"

Support

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

Beautifiers: Prettier, Pretty Diff, ESLint, stylelint

Comparison Table

Language	Prettier	Pretty Diff	ESLint	stylelint
C#	❌	✅	❌	❌
CSS	❌	✅	❌	✅
ColdFusion	❌	✅	❌	❌
EJS	❌	✅	❌	❌
HTML	❌	✅	❌	❌
HTML+ERB	❌	✅	❌	❌
Handlebars	❌	✅	❌	❌
JSON	❌	✅	❌	❌
JSON5	❌	✅	❌	❌
JSX	✅	✅	✅	❌
Java	❌	✅	❌	❌
JavaScript	✅	✅	✅	❌
Less	❌	✅	❌	✅
Riot	❌	✅	❌	❌
SCSS	❌	✅	❌	✅
SVG	❌	✅	❌	❌
Sass	❌	❌	❌	✅
Spacebars	❌	✅	❌	❌
SugarSS	❌	❌	❌	✅
Swig	❌	✅	❌	❌
Titanium Style Sheets	❌	✅	❌	❌
Twig	❌	✅	❌	❌
TypeScript	✅	✅	❌	❌
Visualforce	❌	✅	❌	❌
XML	❌	✅	❌	❌
XTemplate	❌	✅	❌	❌

Examples

Select Language:

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·Main()␊
{␊
Console.WriteLine("Hello,·world!");␊
}␊
}␊

🔧 "none"

Using Pretty Diff beautifier:

using·System;␊
␊
class·Program·{␊
··static·void·Main()·{␊
····Console.WriteLine("Hello,·world!");␊
··}␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "C#": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,9 +1,7 @@
 using·System;␊
 ␊
-class·Program␊
-{␊
-static·void·Main()␊
-{␊
-Console.WriteLine("Hello,·world!");␊
+class·Program·{␊
+··static·void·Main()·{␊
+····Console.WriteLine("Hello,·world!");␊
+··}␊
 }␊
-}␊

🔧 "double"

Using Pretty Diff beautifier:

using·System;␊
␊
class·Program·{␊
··static·void·Main()·{␊
····Console.WriteLine("Hello,·world!");␊
··}␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "C#": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -1,9 +1,7 @@
 using·System;␊
 ␊
-class·Program␊
-{␊
-static·void·Main()␊
-{␊
-Console.WriteLine("Hello,·world!");␊
+class·Program·{␊
+··static·void·Main()·{␊
+····Console.WriteLine("Hello,·world!");␊
+··}␊
 }␊
-}␊

🔧 "single"

Using Pretty Diff beautifier:

using·System;␊
␊
class·Program·{␊
··static·void·Main()·{␊
····Console.WriteLine('Hello,·world!');␊
··}␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "C#": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -1,9 +1,7 @@
 using·System;␊
 ␊
-class·Program␊
-{␊
-static·void·Main()␊
-{␊
-Console.WriteLine("Hello,·world!");␊
+class·Program·{␊
+··static·void·Main()·{␊
+····Console.WriteLine('Hello,·world!');␊
+··}␊
 }␊
-}␊

Edit CSS Example

🚧 Original Code

.name::before·{␊
··content:·"Before:·";␊
}␊
␊
.name::after·{␊
··content:·'...';␊
}␊

🔧 "none"

Using Pretty Diff beautifier:

.name::before·{␊
··content:·"Before:·";␊
}␊
␊
.name::after·{␊
··content:·'...';␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "CSS": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified

🔧 "double"

Using Pretty Diff beautifier:

.name::before·{␊
··content:·"Before:·";␊
}␊
␊
.name::after·{␊
··content:·"...";␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "CSS": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -2,6 +2,6 @@
 ··content:·"Before:·";␊
 }␊
 ␊
 .name::after·{␊
-··content:·'...';␊
+··content:·"...";␊
 }␊

🔧 "single"

Using Pretty Diff beautifier:

.name::before·{␊
··content:·'Before:·';␊
}␊
␊
.name::after·{␊
··content:·'...';␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "CSS": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -1,6 +1,6 @@
 .name::before·{␊
-··content:·"Before:·";␊
+··content:·'Before:·';␊
 }␊
 ␊
 .name::after·{␊
 ··content:·'...';␊

Edit ColdFusion Example

🚧 Original Code

//·Any·variable·set·here·can·be·used·by·all·pages␊
//·Start·session·management.·Used·to·track·session·variables␊
␊
<cfset·this.sessionManagement·=·true>␊
␊
//·Start·client·management.·Used·to·track·client·variables␊
␊
<cfset·this.clientmanagement·=·true>␊
<cfset·this.name·=·"Name·of·your·application">␊
␊
␊
<!---·On·Request·Start·Function--->␊
//·is·called·when·user·request·any·web·page.␊
␊
<cffunction·name="onRequestStart"·output="true"·returntype="void">␊
<cfset·request.datasource·=·"companyk1"·>␊
<cfset·request.companyname·=·"Company·K1·-·HQ">␊
␊
/*·call·your·header·file·everytime·when·user·access·webpage.·So·you·do·not·have·to·include·in·every·page*/␊
<cfinclude·template="companyk1_header.cfm">␊
␊
</cffunction>␊
␊
/*On·request·end·function·is·used·to·called·end·the·end·of·webpage·access·*/␊
␊
<cffunction·name="onRequestEnd"·returntype="void"·output="true">␊
<cfinclude·template="companyk1_footer.cfm">␊
</cffunction>␊

🔧 "none"

Using Pretty Diff beautifier:

//·Any·variable·set·here·can·be·used·by·all·pages␊
//·Start·session·management.·Used·to·track·session·variables␊
␊
<·cfset·this.sessionManagement·=·true·>␊
␊
//·Start·client·management.·Used·to·track·client·variables␊
␊
<cfset·this.clientmanagement=true>␊
<cfset·this.name="Name·of·your·application">␊
␊
<!---·On·Request·Start·Function--->␊
//·is·called·when·user·request·any·web·page.␊
␊
<cffunction·name="onRequestStart"·output="true"·returntype="void">␊
··<cfset·request.datasource="companyk1">␊
··<cfset·request.companyname="Company·K1·-·HQ">␊
␊
··/*·call·your·header·file·everytime·when·user·access·webpage.·So·you·do·not·have·to·include·in·every·page*/␊
··<cfinclude·template="companyk1_header.cfm">␊
␊
</cffunction>␊
␊
/*On·request·end·function·is·used·to·called·end·the·end·of·webpage·access·*/␊
␊
<cffunction·name="onRequestEnd"·returntype="void"·output="true">␊
··<cfinclude·template="companyk1_footer.cfm">␊
</cffunction>

How to configure

A .unibeautify.json file would look like the following:

{
  "ColdFusion": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,28 +1,27 @@
 //·Any·variable·set·here·can·be·used·by·all·pages␊
 //·Start·session·management.·Used·to·track·session·variables␊
 ␊
-<cfset·this.sessionManagement·=·true>␊
+<·cfset·this.sessionManagement·=·true·>␊
 ␊
 //·Start·client·management.·Used·to·track·client·variables␊
 ␊
-<cfset·this.clientmanagement·=·true>␊
-<cfset·this.name·=·"Name·of·your·application">␊
+<cfset·this.clientmanagement=true>␊
+<cfset·this.name="Name·of·your·application">␊
 ␊
-␊
 <!---·On·Request·Start·Function--->␊
 //·is·called·when·user·request·any·web·page.␊
 ␊
 <cffunction·name="onRequestStart"·output="true"·returntype="void">␊
-<cfset·request.datasource·=·"companyk1"·>␊
-<cfset·request.companyname·=·"Company·K1·-·HQ">␊
+··<cfset·request.datasource="companyk1">␊
+··<cfset·request.companyname="Company·K1·-·HQ">␊
 ␊
-/*·call·your·header·file·everytime·when·user·access·webpage.·So·you·do·not·have·to·include·in·every·page*/␊
-<cfinclude·template="companyk1_header.cfm">␊
+··/*·call·your·header·file·everytime·when·user·access·webpage.·So·you·do·not·have·to·include·in·every·page*/␊
+··<cfinclude·template="companyk1_header.cfm">␊
 ␊
 </cffunction>␊
 ␊
 /*On·request·end·function·is·used·to·called·end·the·end·of·webpage·access·*/␊
 ␊
 <cffunction·name="onRequestEnd"·returntype="void"·output="true">␊
-<cfinclude·template="companyk1_footer.cfm">␊
-</cffunction>␊
+··<cfinclude·template="companyk1_footer.cfm">␊
+</cffunction>
\ No newline at end of file

🔧 "double"

Using Pretty Diff beautifier:

//·Any·variable·set·here·can·be·used·by·all·pages␊
//·Start·session·management.·Used·to·track·session·variables␊
␊
<·cfset·this.sessionManagement·=·true·>␊
␊
//·Start·client·management.·Used·to·track·client·variables␊
␊
<cfset·this.clientmanagement=true>␊
<cfset·this.name="Name·of·your·application">␊
␊
<!---·On·Request·Start·Function--->␊
//·is·called·when·user·request·any·web·page.␊
␊
<cffunction·name="onRequestStart"·output="true"·returntype="void">␊
··<cfset·request.datasource="companyk1">␊
··<cfset·request.companyname="Company·K1·-·HQ">␊
␊
··/*·call·your·header·file·everytime·when·user·access·webpage.·So·you·do·not·have·to·include·in·every·page*/␊
··<cfinclude·template="companyk1_header.cfm">␊
␊
</cffunction>␊
␊
/*On·request·end·function·is·used·to·called·end·the·end·of·webpage·access·*/␊
␊
<cffunction·name="onRequestEnd"·returntype="void"·output="true">␊
··<cfinclude·template="companyk1_footer.cfm">␊
</cffunction>

How to configure

A .unibeautify.json file would look like the following:

{
  "ColdFusion": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -1,28 +1,27 @@
 //·Any·variable·set·here·can·be·used·by·all·pages␊
 //·Start·session·management.·Used·to·track·session·variables␊
 ␊
-<cfset·this.sessionManagement·=·true>␊
+<·cfset·this.sessionManagement·=·true·>␊
 ␊
 //·Start·client·management.·Used·to·track·client·variables␊
 ␊
-<cfset·this.clientmanagement·=·true>␊
-<cfset·this.name·=·"Name·of·your·application">␊
+<cfset·this.clientmanagement=true>␊
+<cfset·this.name="Name·of·your·application">␊
 ␊
-␊
 <!---·On·Request·Start·Function--->␊
 //·is·called·when·user·request·any·web·page.␊
 ␊
 <cffunction·name="onRequestStart"·output="true"·returntype="void">␊
-<cfset·request.datasource·=·"companyk1"·>␊
-<cfset·request.companyname·=·"Company·K1·-·HQ">␊
+··<cfset·request.datasource="companyk1">␊
+··<cfset·request.companyname="Company·K1·-·HQ">␊
 ␊
-/*·call·your·header·file·everytime·when·user·access·webpage.·So·you·do·not·have·to·include·in·every·page*/␊
-<cfinclude·template="companyk1_header.cfm">␊
+··/*·call·your·header·file·everytime·when·user·access·webpage.·So·you·do·not·have·to·include·in·every·page*/␊
+··<cfinclude·template="companyk1_header.cfm">␊
 ␊
 </cffunction>␊
 ␊
 /*On·request·end·function·is·used·to·called·end·the·end·of·webpage·access·*/␊
 ␊
 <cffunction·name="onRequestEnd"·returntype="void"·output="true">␊
-<cfinclude·template="companyk1_footer.cfm">␊
-</cffunction>␊
+··<cfinclude·template="companyk1_footer.cfm">␊
+</cffunction>
\ No newline at end of file

🔧 "single"

Using Pretty Diff beautifier:

//·Any·variable·set·here·can·be·used·by·all·pages␊
//·Start·session·management.·Used·to·track·session·variables␊
␊
<·cfset·this.sessionManagement·=·true·>␊
␊
//·Start·client·management.·Used·to·track·client·variables␊
␊
<cfset·this.clientmanagement=true>␊
<cfset·this.name='Name·of·your·application'>␊
␊
<!---·On·Request·Start·Function--->␊
//·is·called·when·user·request·any·web·page.␊
␊
<cffunction·name='onRequestStart'·output='true'·returntype='void'>␊
··<cfset·request.datasource='companyk1'>␊
··<cfset·request.companyname='Company·K1·-·HQ'>␊
␊
··/*·call·your·header·file·everytime·when·user·access·webpage.·So·you·do·not·have·to·include·in·every·page*/␊
··<cfinclude·template='companyk1_header.cfm'>␊
␊
</cffunction>␊
␊
/*On·request·end·function·is·used·to·called·end·the·end·of·webpage·access·*/␊
␊
<cffunction·name='onRequestEnd'·returntype='void'·output='true'>␊
··<cfinclude·template='companyk1_footer.cfm'>␊
</cffunction>

How to configure

A .unibeautify.json file would look like the following:

{
  "ColdFusion": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -1,28 +1,27 @@
 //·Any·variable·set·here·can·be·used·by·all·pages␊
 //·Start·session·management.·Used·to·track·session·variables␊
 ␊
-<cfset·this.sessionManagement·=·true>␊
+<·cfset·this.sessionManagement·=·true·>␊
 ␊
 //·Start·client·management.·Used·to·track·client·variables␊
 ␊
-<cfset·this.clientmanagement·=·true>␊
-<cfset·this.name·=·"Name·of·your·application">␊
+<cfset·this.clientmanagement=true>␊
+<cfset·this.name='Name·of·your·application'>␊
 ␊
-␊
 <!---·On·Request·Start·Function--->␊
 //·is·called·when·user·request·any·web·page.␊
 ␊
-<cffunction·name="onRequestStart"·output="true"·returntype="void">␊
-<cfset·request.datasource·=·"companyk1"·>␊
-<cfset·request.companyname·=·"Company·K1·-·HQ">␊
+<cffunction·name='onRequestStart'·output='true'·returntype='void'>␊
+··<cfset·request.datasource='companyk1'>␊
+··<cfset·request.companyname='Company·K1·-·HQ'>␊
 ␊
-/*·call·your·header·file·everytime·when·user·access·webpage.·So·you·do·not·have·to·include·in·every·page*/␊
-<cfinclude·template="companyk1_header.cfm">␊
+··/*·call·your·header·file·everytime·when·user·access·webpage.·So·you·do·not·have·to·include·in·every·page*/␊
+··<cfinclude·template='companyk1_header.cfm'>␊
 ␊
 </cffunction>␊
 ␊
 /*On·request·end·function·is·used·to·called·end·the·end·of·webpage·access·*/␊
 ␊
-<cffunction·name="onRequestEnd"·returntype="void"·output="true">␊
-<cfinclude·template="companyk1_footer.cfm">␊
-</cffunction>␊
+<cffunction·name='onRequestEnd'·returntype='void'·output='true'>␊
+··<cfinclude·template='companyk1_footer.cfm'>␊
+</cffunction>
\ No newline at end of file

Edit HTML Example

🚧 Original Code

<input·type='text'·id="abc"·value='hello'>␊

🔧 "none"

Using Pretty Diff beautifier:

<input·type='text'·id="abc"·value='hello'>

How to configure

A .unibeautify.json file would look like the following:

{
  "HTML": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,1 +1,1 @@
-<input·type='text'·id="abc"·value='hello'>␊
+<input·type='text'·id="abc"·value='hello'>
\ No newline at end of file

🔧 "double"

Using Pretty Diff beautifier:

<input·type="text"·id="abc"·value="hello">

How to configure

A .unibeautify.json file would look like the following:

{
  "HTML": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -1,1 +1,1 @@
-<input·type='text'·id="abc"·value='hello'>␊
+<input·type="text"·id="abc"·value="hello">
\ No newline at end of file

🔧 "single"

Using Pretty Diff beautifier:

<input·type='text'·id='abc'·value='hello'>

How to configure

A .unibeautify.json file would look like the following:

{
  "HTML": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -1,1 +1,1 @@
-<input·type='text'·id="abc"·value='hello'>␊
+<input·type='text'·id='abc'·value='hello'>
\ No newline at end of file

Edit HTML+ERB Example

🚧 Original Code

<input·type='text'·id="abc"·value='hello'>␊

🔧 "none"

Using Pretty Diff beautifier:

<input·type='text'·id="abc"·value='hello'>

How to configure

A .unibeautify.json file would look like the following:

{
  "HTML+ERB": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,1 +1,1 @@
-<input·type='text'·id="abc"·value='hello'>␊
+<input·type='text'·id="abc"·value='hello'>
\ No newline at end of file

🔧 "double"

Using Pretty Diff beautifier:

<input·type="text"·id="abc"·value="hello">

How to configure

A .unibeautify.json file would look like the following:

{
  "HTML+ERB": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -1,1 +1,1 @@
-<input·type='text'·id="abc"·value='hello'>␊
+<input·type="text"·id="abc"·value="hello">
\ No newline at end of file

🔧 "single"

Using Pretty Diff beautifier:

<input·type='text'·id='abc'·value='hello'>

How to configure

A .unibeautify.json file would look like the following:

{
  "HTML+ERB": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -1,1 +1,1 @@
-<input·type='text'·id="abc"·value='hello'>␊
+<input·type='text'·id='abc'·value='hello'>
\ No newline at end of file

Edit JSON Example

🚧 Original Code

{␊
····"key":·"value"␊
}

🔧 "none"

Using Pretty Diff beautifier:

{␊
··"key":·"value"␊
}

How to configure

A .unibeautify.json file would look like the following:

{
  "JSON": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,3 +1,3 @@
 {␊
-····"key":·"value"␊
+··"key":·"value"␊
 }
\ No newline at end of file

🔧 "double"

Using Pretty Diff beautifier:

{␊
··"key":·"value"␊
}

How to configure

A .unibeautify.json file would look like the following:

{
  "JSON": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -1,3 +1,3 @@
 {␊
-····"key":·"value"␊
+··"key":·"value"␊
 }
\ No newline at end of file

🔧 "single"

Using Pretty Diff beautifier:

{␊
··'key':·'value'␊
}

How to configure

A .unibeautify.json file would look like the following:

{
  "JSON": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -1,3 +1,3 @@
 {␊
-····"key":·"value"␊
+··'key':·'value'␊
 }
\ No newline at end of file

Edit JSON5 Example

🚧 Original Code

{␊
····"key":·"value"␊
}

🔧 "none"

Using Pretty Diff beautifier:

{␊
··"key":·"value"␊
}

How to configure

A .unibeautify.json file would look like the following:

{
  "JSON5": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,3 +1,3 @@
 {␊
-····"key":·"value"␊
+··"key":·"value"␊
 }
\ No newline at end of file

🔧 "double"

Using Pretty Diff beautifier:

{␊
··"key":·"value"␊
}

How to configure

A .unibeautify.json file would look like the following:

{
  "JSON5": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -1,3 +1,3 @@
 {␊
-····"key":·"value"␊
+··"key":·"value"␊
 }
\ No newline at end of file

🔧 "single"

Using Pretty Diff beautifier:

{␊
··'key':·'value'␊
}

How to configure

A .unibeautify.json file would look like the following:

{
  "JSON5": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -1,3 +1,3 @@
 {␊
-····"key":·"value"␊
+··'key':·'value'␊
 }
\ No newline at end of file

Edit JSX Example

🚧 Original Code

console.log('hello·world');␊
console.log("hello·world");␊
const·hello·=·"hey";␊
console.log(`${hello}·world`);

🔧 "none"

Using Prettier beautifier:

console.log("hello·world");␊
console.log("hello·world");␊
const·hello·=·"hey";␊
console.log(`${hello}·world`);␊

How to configure

A .unibeautify.json file would look like the following:

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,4 +1,4 @@
-console.log('hello·world');␊
 console.log("hello·world");␊
+console.log("hello·world");␊
 const·hello·=·"hey";␊
\ No newline at end of file
-console.log(`${hello}·world`);
+console.log(`${hello}·world`);␊

🔧 "double"

Using Prettier beautifier:

console.log("hello·world");␊
console.log("hello·world");␊
const·hello·=·"hey";␊
console.log(`${hello}·world`);␊

How to configure

A .unibeautify.json file would look like the following:

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -1,4 +1,4 @@
-console.log('hello·world');␊
 console.log("hello·world");␊
+console.log("hello·world");␊
 const·hello·=·"hey";␊
\ No newline at end of file
-console.log(`${hello}·world`);
+console.log(`${hello}·world`);␊

🔧 "single"

Using Prettier beautifier:

console.log('hello·world');␊
console.log('hello·world');␊
const·hello·=·'hey';␊
console.log(`${hello}·world`);␊

How to configure

A .unibeautify.json file would look like the following:

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -1,4 +1,4 @@
 console.log('hello·world');␊
-console.log("hello·world");␊
-const·hello·=·"hey";␊
-console.log(`${hello}·world`);
\ No newline at end of file
+console.log('hello·world');␊
+const·hello·=·'hey';␊
+console.log(`${hello}·world`);␊

Edit Java Example

🚧 Original Code

public·class·HelloWorld·{␊
····public·static·void·main(String[]·args)·{␊
········System.out.println('Single·quotes');␊
········System.out.println("Double·quotes");␊
····}␊
}␊

🔧 "none"

Using Pretty Diff beautifier:

public·class·HelloWorld·{␊
··public·static·void·main(String[]·args)·{␊
····System.out.println('Single·quotes');␊
····System.out.println("Double·quotes");␊
··}␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "Java": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,6 +1,6 @@
 public·class·HelloWorld·{␊
-····public·static·void·main(String[]·args)·{␊
-········System.out.println('Single·quotes');␊
-········System.out.println("Double·quotes");␊
-····}␊
+··public·static·void·main(String[]·args)·{␊
+····System.out.println('Single·quotes');␊
+····System.out.println("Double·quotes");␊
+··}␊
 }␊

🔧 "double"

Using Pretty Diff beautifier:

public·class·HelloWorld·{␊
··public·static·void·main(String[]·args)·{␊
····System.out.println("Single·quotes");␊
····System.out.println("Double·quotes");␊
··}␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "Java": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -1,6 +1,6 @@
 public·class·HelloWorld·{␊
-····public·static·void·main(String[]·args)·{␊
-········System.out.println('Single·quotes');␊
-········System.out.println("Double·quotes");␊
-····}␊
+··public·static·void·main(String[]·args)·{␊
+····System.out.println("Single·quotes");␊
+····System.out.println("Double·quotes");␊
+··}␊
 }␊

🔧 "single"

Using Pretty Diff beautifier:

public·class·HelloWorld·{␊
··public·static·void·main(String[]·args)·{␊
····System.out.println('Single·quotes');␊
····System.out.println('Double·quotes');␊
··}␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "Java": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -1,6 +1,6 @@
 public·class·HelloWorld·{␊
-····public·static·void·main(String[]·args)·{␊
-········System.out.println('Single·quotes');␊
-········System.out.println("Double·quotes");␊
-····}␊
+··public·static·void·main(String[]·args)·{␊
+····System.out.println('Single·quotes');␊
+····System.out.println('Double·quotes');␊
+··}␊
 }␊

Edit JavaScript Example

🚧 Original Code

console.log('hello·world');␊
console.log("hello·world");␊
const·hello·=·"hey";␊
console.log(`${hello}·world`);

🔧 "none"

Using Prettier beautifier:

console.log("hello·world");␊
console.log("hello·world");␊
const·hello·=·"hey";␊
console.log(`${hello}·world`);␊

How to configure

A .unibeautify.json file would look like the following:

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,4 +1,4 @@
-console.log('hello·world');␊
 console.log("hello·world");␊
+console.log("hello·world");␊
 const·hello·=·"hey";␊
\ No newline at end of file
-console.log(`${hello}·world`);
+console.log(`${hello}·world`);␊

🔧 "double"

Using Prettier beautifier:

console.log("hello·world");␊
console.log("hello·world");␊
const·hello·=·"hey";␊
console.log(`${hello}·world`);␊

How to configure

A .unibeautify.json file would look like the following:

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -1,4 +1,4 @@
-console.log('hello·world');␊
 console.log("hello·world");␊
+console.log("hello·world");␊
 const·hello·=·"hey";␊
\ No newline at end of file
-console.log(`${hello}·world`);
+console.log(`${hello}·world`);␊

🔧 "single"

Using Prettier beautifier:

console.log('hello·world');␊
console.log('hello·world');␊
const·hello·=·'hey';␊
console.log(`${hello}·world`);␊

How to configure

A .unibeautify.json file would look like the following:

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -1,4 +1,4 @@
 console.log('hello·world');␊
-console.log("hello·world");␊
-const·hello·=·"hey";␊
-console.log(`${hello}·world`);
\ No newline at end of file
+console.log('hello·world');␊
+const·hello·=·'hey';␊
+console.log(`${hello}·world`);␊

Edit Less Example

🚧 Original Code

//·Variables␊
@images:·"../img";␊
␊
//·Usage␊
body·{␊
··color:·#444;␊
··background:·url("@{images}/white-sand.png");␊
}

🔧 "none"

Using Pretty Diff beautifier:

//·Variables␊
@images:·"../img";␊
␊
//·Usage␊
body·{␊
··color:·#444;␊
··background:·url("@{images}/white-sand.png");␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "Less": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -4,5 +4,5 @@
 //·Usage␊
 body·{␊
 ··color:·#444;␊
 ··background:·url("@{images}/white-sand.png");␊
-}
\ No newline at end of file
+}␊

🔧 "double"

Using Pretty Diff beautifier:

//·Variables␊
@images:·"../img";␊
␊
//·Usage␊
body·{␊
··color:·#444;␊
··background:·url("@{images}/white-sand.png");␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "Less": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -4,5 +4,5 @@
 //·Usage␊
 body·{␊
 ··color:·#444;␊
 ··background:·url("@{images}/white-sand.png");␊
-}
\ No newline at end of file
+}␊

🔧 "single"

Using Pretty Diff beautifier:

//·Variables␊
@images:·'../img';␊
␊
//·Usage␊
body·{␊
··color:·#444;␊
··background:·url('@{images}/white-sand.png');␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "Less": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -1,8 +1,8 @@
 //·Variables␊
-@images:·"../img";␊
+@images:·'../img';␊
 ␊
 //·Usage␊
 body·{␊
 ··color:·#444;␊
-··background:·url("@{images}/white-sand.png");␊
\ No newline at end of file
-}
+··background:·url('@{images}/white-sand.png');␊
+}␊

Edit SCSS Example

🚧 Original Code

//·Variables␊
@images:·"../img";␊
␊
//·Usage␊
body·{␊
··color:·#444;␊
··background:·url("@{images}/white-sand.png");␊
}

🔧 "none"

Using Pretty Diff beautifier:

//·Variables␊
@images:·"../img";␊
␊
//·Usage␊
body·{␊
··color:·#444;␊
··background:·url("@{images}/white-sand.png");␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "SCSS": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -4,5 +4,5 @@
 //·Usage␊
 body·{␊
 ··color:·#444;␊
 ··background:·url("@{images}/white-sand.png");␊
-}
\ No newline at end of file
+}␊

🔧 "double"

Using Pretty Diff beautifier:

//·Variables␊
@images:·"../img";␊
␊
//·Usage␊
body·{␊
··color:·#444;␊
··background:·url("@{images}/white-sand.png");␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "SCSS": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -4,5 +4,5 @@
 //·Usage␊
 body·{␊
 ··color:·#444;␊
 ··background:·url("@{images}/white-sand.png");␊
-}
\ No newline at end of file
+}␊

🔧 "single"

Using Pretty Diff beautifier:

//·Variables␊
@images:·'../img';␊
␊
//·Usage␊
body·{␊
··color:·#444;␊
··background:·url('@{images}/white-sand.png');␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "SCSS": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -1,8 +1,8 @@
 //·Variables␊
-@images:·"../img";␊
+@images:·'../img';␊
 ␊
 //·Usage␊
 body·{␊
 ··color:·#444;␊
-··background:·url("@{images}/white-sand.png");␊
\ No newline at end of file
-}
+··background:·url('@{images}/white-sand.png');␊
+}␊

Edit Sass Example

🚧 Original Code

//·Variables␊
@images:·"../img";␊
␊
//·Usage␊
body·{␊
··color:·#444;␊
··background:·url("@{images}/white-sand.png");␊
}

🔧 "none"

Using stylelint beautifier:

//·Variables␊
@images:·"../img";␊
␊
//·Usage␊
body·{␊
··color:·#444;␊
··background:·url("@{images}/white-sand.png");␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "Sass": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -4,5 +4,5 @@
 //·Usage␊
 body·{␊
 ··color:·#444;␊
 ··background:·url("@{images}/white-sand.png");␊
-}
\ No newline at end of file
+}␊

🔧 "double"

Using stylelint beautifier:

//·Variables␊
@images:·"../img";␊
␊
//·Usage␊
body·{␊
··color:·#444;␊
··background:·url("@{images}/white-sand.png");␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "Sass": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -4,5 +4,5 @@
 //·Usage␊
 body·{␊
 ··color:·#444;␊
 ··background:·url("@{images}/white-sand.png");␊
-}
\ No newline at end of file
+}␊

🔧 "single"

Using stylelint beautifier:

//·Variables␊
@images:·"../img";␊
␊
//·Usage␊
body·{␊
··color:·#444;␊
··background:·url('@{images}/white-sand.png');␊
}␊

How to configure

A .unibeautify.json file would look like the following:

{
  "Sass": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -3,6 +3,6 @@
 ␊
 //·Usage␊
 body·{␊
 ··color:·#444;␊
-··background:·url("@{images}/white-sand.png");␊
-}
\ No newline at end of file
+··background:·url('@{images}/white-sand.png');␊
+}␊

Edit SugarSS Example

🚧 Original Code

body␊
··color:·#444;␊
··background:·url("white-sand.png")

🔧 "none"

Using stylelint beautifier:

body␊
··color:·#444;color␊
background:·url("white-sand.png")␊

How to configure

A .unibeautify.json file would look like the following:

{
  "SugarSS": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,3 +1,3 @@
 body␊
-··color:·#444;␊
-··background:·url("white-sand.png")
\ No newline at end of file
+··color:·#444;color␊
+background:·url("white-sand.png")␊

🔧 "double"

Using stylelint beautifier:

body␊
··color:·#444;color␊
background:·url("white-sand.png")␊

How to configure

A .unibeautify.json file would look like the following:

{
  "SugarSS": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -1,3 +1,3 @@
 body␊
-··color:·#444;␊
-··background:·url("white-sand.png")
\ No newline at end of file
+··color:·#444;color␊
+background:·url("white-sand.png")␊

🔧 "single"

Using stylelint beautifier:

body␊
··color:·#444;color␊
background:·url('white-sand.png')␊

How to configure

A .unibeautify.json file would look like the following:

{
  "SugarSS": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -1,3 +1,3 @@
 body␊
-··color:·#444;␊
-··background:·url("white-sand.png")
\ No newline at end of file
+··color:·#444;color␊
+background:·url('white-sand.png')␊

Edit Twig Example

🚧 Original Code

<!DOCTYPE·html>␊
<html>␊
<head>␊
<title>My·Webpage</title>␊
</head>␊
<body>␊
<ul·id="navigation">␊
{%·for·item·in·navigation·%}␊
<li><a·href="{{·item.href·}}">{{·item.caption·}}</a></li>␊
{%·endfor·%}␊
</ul>␊
␊
<h1>My·Webpage</h1>␊
{{·a_variable·}}␊
</body>␊
</html>␊

🔧 "none"

Using Pretty Diff beautifier:

<!DOCTYPE·html>␊
<html>␊
··<head>␊
····<title>My·Webpage</title>␊
··</head>␊
··<body>␊
····<ul·id="navigation">␊
······{%·for·item·in·navigation·%}␊
········<li>␊
··········<a·href="{{·item.href·}}">{{·item.caption·}}</a>␊
········</li>␊
······{%·endfor·%}␊
····</ul>␊
␊
····<h1>My·Webpage</h1>␊
····{{·a_variable·}}␊
··</body>␊
</html>

How to configure

A .unibeautify.json file would look like the following:

{
  "Twig": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,16 +1,18 @@
 <!DOCTYPE·html>␊
 <html>␊
-<head>␊
-<title>My·Webpage</title>␊
-</head>␊
-<body>␊
-<ul·id="navigation">␊
-{%·for·item·in·navigation·%}␊
-<li><a·href="{{·item.href·}}">{{·item.caption·}}</a></li>␊
-{%·endfor·%}␊
-</ul>␊
+··<head>␊
+····<title>My·Webpage</title>␊
+··</head>␊
+··<body>␊
+····<ul·id="navigation">␊
+······{%·for·item·in·navigation·%}␊
+········<li>␊
+··········<a·href="{{·item.href·}}">{{·item.caption·}}</a>␊
+········</li>␊
+······{%·endfor·%}␊
+····</ul>␊
 ␊
-<h1>My·Webpage</h1>␊
-{{·a_variable·}}␊
-</body>␊
-</html>␊
+····<h1>My·Webpage</h1>␊
+····{{·a_variable·}}␊
+··</body>␊
+</html>
\ No newline at end of file

🔧 "double"

Using Pretty Diff beautifier:

<!DOCTYPE·html>␊
<html>␊
··<head>␊
····<title>My·Webpage</title>␊
··</head>␊
··<body>␊
····<ul·id="navigation">␊
······{%·for·item·in·navigation·%}␊
········<li>␊
··········<a·href="{{·item.href·}}">{{·item.caption·}}</a>␊
········</li>␊
······{%·endfor·%}␊
····</ul>␊
␊
····<h1>My·Webpage</h1>␊
····{{·a_variable·}}␊
··</body>␊
</html>

How to configure

A .unibeautify.json file would look like the following:

{
  "Twig": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -1,16 +1,18 @@
 <!DOCTYPE·html>␊
 <html>␊
-<head>␊
-<title>My·Webpage</title>␊
-</head>␊
-<body>␊
-<ul·id="navigation">␊
-{%·for·item·in·navigation·%}␊
-<li><a·href="{{·item.href·}}">{{·item.caption·}}</a></li>␊
-{%·endfor·%}␊
-</ul>␊
+··<head>␊
+····<title>My·Webpage</title>␊
+··</head>␊
+··<body>␊
+····<ul·id="navigation">␊
+······{%·for·item·in·navigation·%}␊
+········<li>␊
+··········<a·href="{{·item.href·}}">{{·item.caption·}}</a>␊
+········</li>␊
+······{%·endfor·%}␊
+····</ul>␊
 ␊
-<h1>My·Webpage</h1>␊
-{{·a_variable·}}␊
-</body>␊
-</html>␊
+····<h1>My·Webpage</h1>␊
+····{{·a_variable·}}␊
+··</body>␊
+</html>
\ No newline at end of file

🔧 "single"

Using Pretty Diff beautifier:

<!DOCTYPE·html>␊
<html>␊
··<head>␊
····<title>My·Webpage</title>␊
··</head>␊
··<body>␊
····<ul·id='navigation'>␊
······{%·for·item·in·navigation·%}␊
········<li>␊
··········<a·href='{{·item.href·}}'>{{·item.caption·}}</a>␊
········</li>␊
······{%·endfor·%}␊
····</ul>␊
␊
····<h1>My·Webpage</h1>␊
····{{·a_variable·}}␊
··</body>␊
</html>

How to configure

A .unibeautify.json file would look like the following:

{
  "Twig": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -1,16 +1,18 @@
 <!DOCTYPE·html>␊
 <html>␊
-<head>␊
-<title>My·Webpage</title>␊
-</head>␊
-<body>␊
-<ul·id="navigation">␊
-{%·for·item·in·navigation·%}␊
-<li><a·href="{{·item.href·}}">{{·item.caption·}}</a></li>␊
-{%·endfor·%}␊
-</ul>␊
+··<head>␊
+····<title>My·Webpage</title>␊
+··</head>␊
+··<body>␊
+····<ul·id='navigation'>␊
+······{%·for·item·in·navigation·%}␊
+········<li>␊
+··········<a·href='{{·item.href·}}'>{{·item.caption·}}</a>␊
+········</li>␊
+······{%·endfor·%}␊
+····</ul>␊
 ␊
-<h1>My·Webpage</h1>␊
-{{·a_variable·}}␊
-</body>␊
-</html>␊
+····<h1>My·Webpage</h1>␊
+····{{·a_variable·}}␊
+··</body>␊
+</html>
\ No newline at end of file

Edit TypeScript Example

🚧 Original Code

class·Greeter·{␊
··␊
··constructor(greeting:·string)·{␊
····console.log(`${greeting}·world!`);␊
··}␊
··␊
}␊
␊
new·Greeter('hello');␊
new·Greeter("hello");␊
␊
const·hello·=·"hey";␊
␊
new·Greeter(hello);␊

🔧 "none"

Using Prettier beautifier:

class·Greeter·{␊
··constructor(greeting:·string)·{␊
····console.log(`${greeting}·world!`);␊
··}␊
}␊
␊
new·Greeter("hello");␊
new·Greeter("hello");␊
␊
const·hello·=·"hey";␊
␊
new·Greeter(hello);␊

How to configure

A .unibeautify.json file would look like the following:

{
  "TypeScript": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,14 +1,12 @@
 class·Greeter·{␊
-··␊
 ··constructor(greeting:·string)·{␊
 ····console.log(`${greeting}·world!`);␊
 ··}␊
-··␊
 }␊
 ␊
-new·Greeter('hello');␊
 new·Greeter("hello");␊
+new·Greeter("hello");␊
 ␊
 const·hello·=·"hey";␊
 ␊
 new·Greeter(hello);␊

🔧 "double"

Using Prettier beautifier:

class·Greeter·{␊
··constructor(greeting:·string)·{␊
····console.log(`${greeting}·world!`);␊
··}␊
}␊
␊
new·Greeter("hello");␊
new·Greeter("hello");␊
␊
const·hello·=·"hey";␊
␊
new·Greeter(hello);␊

How to configure

A .unibeautify.json file would look like the following:

{
  "TypeScript": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -1,14 +1,12 @@
 class·Greeter·{␊
-··␊
 ··constructor(greeting:·string)·{␊
 ····console.log(`${greeting}·world!`);␊
 ··}␊
-··␊
 }␊
 ␊
-new·Greeter('hello');␊
 new·Greeter("hello");␊
+new·Greeter("hello");␊
 ␊
 const·hello·=·"hey";␊
 ␊
 new·Greeter(hello);␊

🔧 "single"

Using Prettier beautifier:

class·Greeter·{␊
··constructor(greeting:·string)·{␊
····console.log(`${greeting}·world!`);␊
··}␊
}␊
␊
new·Greeter('hello');␊
new·Greeter('hello');␊
␊
const·hello·=·'hey';␊
␊
new·Greeter(hello);␊

How to configure

A .unibeautify.json file would look like the following:

{
  "TypeScript": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "Prettier"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -1,14 +1,12 @@
 class·Greeter·{␊
-··␊
 ··constructor(greeting:·string)·{␊
 ····console.log(`${greeting}·world!`);␊
 ··}␊
-··␊
 }␊
 ␊
 new·Greeter('hello');␊
-new·Greeter("hello");␊
+new·Greeter('hello');␊
 ␊
-const·hello·=·"hey";␊
+const·hello·=·'hey';␊
 ␊
 new·Greeter(hello);␊

Edit XML Example

🚧 Original Code

<input·type='text'·id="abc"·value='hello'>␊

🔧 "none"

Using Pretty Diff beautifier:

<input·type='text'·id="abc"·value='hello'>

How to configure

A .unibeautify.json file would look like the following:

{
  "XML": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "none",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: none
===================================================================
--- none    Original
+++ none    Beautified
@@ -1,1 +1,1 @@
-<input·type='text'·id="abc"·value='hello'>␊
+<input·type='text'·id="abc"·value='hello'>
\ No newline at end of file

🔧 "double"

Using Pretty Diff beautifier:

<input·type="text"·id="abc"·value="hello">

How to configure

A .unibeautify.json file would look like the following:

{
  "XML": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "double",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: double
===================================================================
--- double  Original
+++ double  Beautified
@@ -1,1 +1,1 @@
-<input·type='text'·id="abc"·value='hello'>␊
+<input·type="text"·id="abc"·value="hello">
\ No newline at end of file

🔧 "single"

Using Pretty Diff beautifier:

<input·type='text'·id='abc'·value='hello'>

How to configure

A .unibeautify.json file would look like the following:

{
  "XML": {
    "indent_size": 2,
    "indent_char": " ",
    "quotes": "single",
    "beautifiers": [
      "Pretty Diff"
    ]
  }
}

Difference from original

Index: single
===================================================================
--- single  Original
+++ single  Beautified
@@ -1,1 +1,1 @@
-<input·type='text'·id="abc"·value='hello'>␊
+<input·type='text'·id='abc'·value='hello'>
\ No newline at end of file