Newline Before Tags · Unibeautify

Config Key: newline_before_tags

Description: List of tags which should have an extra newline before them.

Available since version: 0.7.0 (Current: )

Type: array of strings

Default: ["head","body","/html"]

Support

Edit Beautifiers

Languages: HTML, Handlebars, Liquid, Mustache, XML

Beautifiers: JS-Beautify

Comparison Table

Language	JS-Beautify
HTML	✅
Handlebars	✅
Liquid	✅
Mustache	✅
XML	✅

Examples

Select Language:

Invisible characters are shown with the following symbols:

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

Edit HTML Example

🚧 Original Code

<html>␊
<head></head>␊
<body>␊
··<div>␊
····<span>Hello·world</span>␊
··</div>␊
</body>␊
</html>

🔧 []

Using JS-Beautify beautifier:

<html>␊
<head></head>␊
<body>␊
··<div>␊
····<span>Hello·world</span>␊
··</div>␊
</body>␊
</html>

How to configure

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

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

Difference from original

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

🔧 ["head","body","/html"]

Using JS-Beautify beautifier:

<html>␊
␊
<head></head>␊
␊
<body>␊
··<div>␊
····<span>Hello·world</span>␊
··</div>␊
</body>␊
␊
</html>

How to configure

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

{
  "HTML": {
    "indent_size": 2,
    "indent_char": " ",
    "newline_before_tags": [
      "head",
      "body",
      "/html"
    ],
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: head,body,/html
===================================================================
--- head,body,/html Original
+++ head,body,/html Beautified
@@ -1,8 +1,11 @@
 <html>␊
+␊
 <head></head>␊
+␊
 <body>␊
 ··<div>␊
 ····<span>Hello·world</span>␊
 ··</div>␊
 </body>␊
+␊
 </html>
\ No newline at end of file

Edit XML Example

🚧 Original Code

<html>␊
<head></head>␊
<body>␊
··<div>␊
····<span>Hello·world</span>␊
··</div>␊
</body>␊
</html>␊

🔧 []

Using JS-Beautify beautifier:

<html>␊
<head></head>␊
<body>␊
··<div>␊
····<span>Hello·world</span>␊
··</div>␊
</body>␊
</html>

How to configure

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

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

Difference from original

Index: 
===================================================================
---     Original
+++     Beautified
@@ -4,5 +4,5 @@
 ··<div>␊
 ····<span>Hello·world</span>␊
 ··</div>␊
 </body>␊
-</html>␊
+</html>
\ No newline at end of file

🔧 ["head","body","/html"]

Using JS-Beautify beautifier:

<html>␊
␊
<head></head>␊
␊
<body>␊
··<div>␊
····<span>Hello·world</span>␊
··</div>␊
</body>␊
␊
</html>

How to configure

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

{
  "XML": {
    "indent_size": 2,
    "indent_char": " ",
    "newline_before_tags": [
      "head",
      "body",
      "/html"
    ],
    "beautifiers": [
      "JS-Beautify"
    ]
  }
}

Difference from original

Index: head,body,/html
===================================================================
--- head,body,/html Original
+++ head,body,/html Beautified
@@ -1,8 +1,11 @@
 <html>␊
+␊
 <head></head>␊
+␊
 <body>␊
 ··<div>␊
 ····<span>Hello·world</span>␊
 ··</div>␊
 </body>␊
-</html>␊
+␊
+</html>
\ No newline at end of file