Unibeautify
  • Install
  • Docs
  • Assistant
  • Playground
  • GitHub

›R

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

Remove Trailing Whitespace

Config Key: remove_trailing_whitespace

Description: Remove trailing whitespace

Available since version: 0.7.0 (Current: npm)

Type: boolean

Default: false

Support

Edit Beautifiers

Languages: CSS, JSX, JavaScript, Less, SCSS, Sass, SugarSS

Beautifiers: ESLint, stylelint

Comparison Table

LanguageESLintstylelint
CSS❌✅
JSX✅❌
JavaScript✅❌
Less❌✅
SCSS❌✅
Sass❌✅
SugarSS❌✅

Examples

Invisible characters are shown with the following symbols:

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

Edit CSS Example

🚧 Original Code

.class1·{··············␊
·color:·blue;··········␊
}······················␊
·······················

🔧 true

Using stylelint beautifier:

.class1·{␊
··color:·blue;␊
}␊

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

{
  "CSS": {
    "indent_size": 2,
    "indent_char": " ",
    "remove_trailing_whitespace": true,
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: true
===================================================================
--- true    Original
+++ true    Beautified
@@ -1,4 +1,3 @@
-.class1·{··············␊
-·color:·blue;··········␊
-}······················␊
-·······················
\ No newline at end of file
+.class1·{␊
+··color:·blue;␊
+}␊

🔧 false

Using stylelint beautifier:

.class1·{··············␊
··color:·blue;··········␊
}␊

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

{
  "CSS": {
    "indent_size": 2,
    "indent_char": " ",
    "remove_trailing_whitespace": false,
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: false
===================================================================
--- false   Original
+++ false   Beautified
@@ -1,4 +1,3 @@
 .class1·{··············␊
-·color:·blue;··········␊
-}······················␊
-·······················
\ No newline at end of file
+··color:·blue;··········␊
+}␊

Edit JSX Example

🚧 Original Code

//·comment·······␊
console.log("test");·········␊

🔧 true

Using ESLint beautifier:

//·comment␊
console.log("test");␊

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

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "remove_trailing_whitespace": true,
    "beautifiers": [
      "ESLint"
    ]
  }
}

Difference from original

Index: true
===================================================================
--- true    Original
+++ true    Beautified
@@ -1,2 +1,2 @@
-//·comment·······␊
-console.log("test");·········␊
+//·comment␊
+console.log("test");␊

🔧 false

Using ESLint beautifier:

//·comment·······␊
console.log("test");·········␊

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

{
  "JSX": {
    "indent_size": 2,
    "indent_char": " ",
    "remove_trailing_whitespace": false,
    "beautifiers": [
      "ESLint"
    ]
  }
}

Difference from original

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

Edit JavaScript Example

🚧 Original Code

//·comment·······␊
console.log("test");·········␊

🔧 true

Using ESLint beautifier:

//·comment␊
console.log("test");␊

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

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "remove_trailing_whitespace": true,
    "beautifiers": [
      "ESLint"
    ]
  }
}

Difference from original

Index: true
===================================================================
--- true    Original
+++ true    Beautified
@@ -1,2 +1,2 @@
-//·comment·······␊
-console.log("test");·········␊
+//·comment␊
+console.log("test");␊

🔧 false

Using ESLint beautifier:

//·comment·······␊
console.log("test");·········␊

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

{
  "JavaScript": {
    "indent_size": 2,
    "indent_char": " ",
    "remove_trailing_whitespace": false,
    "beautifiers": [
      "ESLint"
    ]
  }
}

Difference from original

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

Edit Less Example

🚧 Original Code

@primary:··green;·······␊
.section·{··············␊
··@color:·primary;······␊
}·······················␊

🔧 true

Using stylelint beautifier:

@primary:··green;␊
.section·{␊
··@color:·primary;␊
}␊

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

{
  "Less": {
    "indent_size": 2,
    "indent_char": " ",
    "remove_trailing_whitespace": true,
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: true
===================================================================
--- true    Original
+++ true    Beautified
@@ -1,4 +1,4 @@
-@primary:··green;·······␊
-.section·{··············␊
-··@color:·primary;······␊
-}·······················␊
+@primary:··green;␊
+.section·{␊
+··@color:·primary;␊
+}␊

🔧 false

Using stylelint beautifier:

@primary:··green;·······␊
.section·{··············␊
··@color:·primary;······␊
}·······················␊

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

{
  "Less": {
    "indent_size": 2,
    "indent_char": " ",
    "remove_trailing_whitespace": false,
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

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

Edit SCSS Example

🚧 Original Code

nav·{·················␊
··ul·{················␊
····margin:·0;········␊
····padding:·0;·······␊
····list-style:·none;·␊
··}···················␊
}·····················

🔧 true

Using stylelint beautifier:

nav·{␊
··ul·{␊
····margin:·0;␊
····padding:·0;␊
····list-style:·none;␊
··}␊
}␊

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

{
  "SCSS": {
    "indent_size": 2,
    "indent_char": " ",
    "remove_trailing_whitespace": true,
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: true
===================================================================
--- true    Original
+++ true    Beautified
@@ -1,7 +1,7 @@
-nav·{·················␊
-··ul·{················␊
-····margin:·0;········␊
-····padding:·0;·······␊
-····list-style:·none;·␊
-··}···················␊
-}·····················
\ No newline at end of file
+nav·{␊
+··ul·{␊
+····margin:·0;␊
+····padding:·0;␊
+····list-style:·none;␊
+··}␊
+}␊

🔧 false

Using stylelint beautifier:

nav·{·················␊
··ul·{················␊
····margin:·0;········␊
····padding:·0;·······␊
····list-style:·none;·␊
··}···················␊
}␊

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

{
  "SCSS": {
    "indent_size": 2,
    "indent_char": " ",
    "remove_trailing_whitespace": false,
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: false
===================================================================
--- false   Original
+++ false   Beautified
@@ -3,5 +3,5 @@
 ····margin:·0;········␊
 ····padding:·0;·······␊
 ····list-style:·none;·␊
 ··}···················␊
-}·····················
\ No newline at end of file
+}␊

Edit Sass Example

🚧 Original Code

nav···················␊
··ul··················␊
····margin:·0·········␊
····padding:·0········␊
····list-style:·none··␊

🔧 true

Using stylelint beautifier:

nav␊
··ul␊
····margin:·0;ulmargin␊
padding:·0;␊
list-style:·none␊

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

{
  "Sass": {
    "indent_size": 2,
    "indent_char": " ",
    "remove_trailing_whitespace": true,
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: true
===================================================================
--- true    Original
+++ true    Beautified
@@ -1,5 +1,5 @@
-nav···················␊
-··ul··················␊
-····margin:·0·········␊
-····padding:·0········␊
-····list-style:·none··␊
+nav␊
+··ul␊
+····margin:·0;ulmargin␊
+padding:·0;␊
+list-style:·none␊

🔧 false

Using stylelint beautifier:

nav···················␊
··ul··················␊
····margin:·0;ulmargin·········␊
padding:·0;········␊
list-style:·none··␊

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

{
  "Sass": {
    "indent_size": 2,
    "indent_char": " ",
    "remove_trailing_whitespace": false,
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: false
===================================================================
--- false   Original
+++ false   Beautified
@@ -1,5 +1,5 @@
 nav···················␊
 ··ul··················␊
-····margin:·0·········␊
-····padding:·0········␊
-····list-style:·none··␊
+····margin:·0;ulmargin·········␊
+padding:·0;········␊
+list-style:·none··␊

Edit SugarSS Example

🚧 Original Code

a··························␊
··color:·blue··············␊

🔧 true

Using stylelint beautifier:

a␊
··color:·bluecolor␊

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

{
  "SugarSS": {
    "indent_size": 2,
    "indent_char": " ",
    "remove_trailing_whitespace": true,
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: true
===================================================================
--- true    Original
+++ true    Beautified
@@ -1,2 +1,2 @@
-a··························␊
-··color:·blue··············␊
+a␊
+··color:·bluecolor␊

🔧 false

Using stylelint beautifier:

a··························␊
··color:·bluecolor··············␊

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

{
  "SugarSS": {
    "indent_size": 2,
    "indent_char": " ",
    "remove_trailing_whitespace": false,
    "beautifiers": [
      "stylelint"
    ]
  }
}

Difference from original

Index: false
===================================================================
--- false   Original
+++ false   Beautified
@@ -1,2 +1,2 @@
 a··························␊
-··color:·blue··············␊
+··color:·bluecolor··············␊

← QuotesSelector Separator Newline →
  • 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