Skip to content

no-multi-spaces ​

Multiple spaces in a row that are not used for indentation are typically mistakes. For example:

js

if(foo  === "bar") {}

It's hard to tell, but there are two spaces between foo and ===. Multiple spaces such as this are generally frowned upon in favor of single spaces:

js

if(foo === "bar") {}

Rule Details ​

This rule aims to disallow multiple whitespace around logical expressions, conditional expressions, declarations, array elements, object properties, sequences and function parameters.

Examples of incorrect code for this rule:

jsx
/* eslint @stylistic/no-multi-spaces: "error" */

var a =
1;
if(foo
=== "bar") {}
a <<
b
var arr = [1,
2];
a ?
b: c;
<App
spacy />;
<App too
spacy />;
incorrect

Examples of correct code for this rule:

jsx
/* eslint @stylistic/no-multi-spaces: "error" */

var a = 1;

if(foo === "bar") {}

a << b

var arr = [1, 2];

a ? b: c;

<App cozy />;

<App very cozy />;
correct

Options ​

This rule's configuration consists of an object with the following properties:

  • "ignoreEOLComments" (defaults to false) ignores multiple spaces before comments that occur at the end of lines
  • "exceptions" specifies nodes to ignore
  • "includeTabs" (defaults to true) consider multiple tabs or spaces mixed with tabs as multiple spaces

ignoreEOLComments ​

Examples of incorrect code for this rule with the { "ignoreEOLComments": false } (default) option:

js
/* eslint @stylistic/no-multi-spaces: ["error", { ignoreEOLComments: false }] */

var x = 5;
// comment
var x = 5;
/* multiline
* comment */
incorrect

Examples of correct code for this rule with the { "ignoreEOLComments": false } (default) option:

js
/* eslint @stylistic/no-multi-spaces: ["error", { ignoreEOLComments: false }] */

var x = 5; // comment
var x = 5; /* multiline
 * comment
 */
correct

Examples of correct code for this rule with the { "ignoreEOLComments": true } option:

js
/* eslint @stylistic/no-multi-spaces: ["error", { ignoreEOLComments: true }] */

var x = 5; // comment
var x = 5;      // comment
var x = 5; /* multiline
 * comment
 */
var x = 5;      /* multiline
 * comment
 */
correct

exceptions ​

To avoid contradictions with other rules that require multiple spaces, this rule has an exceptions option to ignore certain nodes.

This option is an object that expects property names to be AST node types as defined by ESTree. The easiest way to determine the node types for exceptions is to use AST Explorer with the espree parser.

TIP

Because for the key-spacing rule some alignment options require multiple spaces in properties of object literals and import attributes. You can ignore the Property and ImportAttribute to avoid the conflict.

Examples of incorrect code for the default "exceptions" option:

js
/* eslint @stylistic/no-multi-spaces: ["error"] */
/* eslint @stylistic/key-spacing: ["error", { align: "value" }] */

var obj = {
    first:
"first",
second: "second" };
incorrect

Examples of correct code for the "exceptions": { "Property": true } option:

js
/* eslint @stylistic/no-multi-spaces: ["error", { exceptions: { "Property": true } }] */
/* eslint @stylistic/key-spacing: ["error", { align: "value" }] */

var obj = {
    first:  "first",
    second: "second"
};
correct

Examples of correct code for the "exceptions": { "BinaryExpression": true } option:

js
/* eslint @stylistic/no-multi-spaces: ["error", { exceptions: { "BinaryExpression": true } }] */

var a = 1  *  2;
correct

Examples of correct code for the "exceptions": { "VariableDeclarator": true } option:

js
/* eslint @stylistic/no-multi-spaces: ["error", { exceptions: { "VariableDeclarator": true } }] */

var someVar      = 'foo';
var someOtherVar = 'barBaz';
correct

Examples of correct code for the "exceptions": { "ImportDeclaration": true } option:

js
/* eslint @stylistic/no-multi-spaces: ["error", { exceptions: { "ImportDeclaration": true } }] */

import mod          from 'mod';
import someOtherMod from 'some-other-mod';
correct

includeTabs ​

Consider multiple tabs (\t) or spaces mixed with tabs as multiple spaces for this rule. This option defaults to true.

Example of incorrect code for this rule with the { "includeTabs": true } option:

js
/* eslint @stylistic/no-multi-spaces: ["error", { "includeTabs": true }] */

var a =
1 +
2;
incorrect

When Not To Use It ​

If you don't want to check and disallow multiple spaces, then you should turn this rule off.

Changelog ​

v6.0.0-beta.4 on

Released under the MIT License.