Skip to main content

​
indent

Enforce consistent indentation throughout your code.
Rule Type: Layout
Fixable: Yes (automatically fixable)
Deprecated: Consider using Prettier

​
Rule Details

This rule enforces a consistent indentation style. The default is 4 spaces.

​
Options

The first option is the indent size:
  • Number (e.g., 2, 4) - Number of spaces
  • "tab" - Use tab character
// 2 spaces
{
  "indent": ["error", 2]
}

// 4 spaces (default)
{
  "indent": ["error", 4]
}

// Tabs
{
  "indent": ["error", "tab"]
}

​
Examples

​
Incorrect (default 4 spaces)

if (a) {
  b=c;
  function foo(d) {
    e=f;
  }
}

​
Correct (default 4 spaces)

if (a) {
    b=c;
    function foo(d) {
        e=f;
    }
}

​
Advanced Options

The second parameter is an object with many options:

​
SwitchCase

Default: 0 Indent level for case clauses: 
// With { "SwitchCase": 1 } and 2 spaces
switch(a){
  case "a":
    break;
  case "b":
    break;
}

​
VariableDeclarator

Default: 1 Indent level for multi-line variable declarations: 
// With { "VariableDeclarator": 1 } and 2 spaces
var a,
  b,
  c;

​
MemberExpression

Default: 1 Indent level for multi-line property chains: 
// With { "MemberExpression": 1 } and 2 spaces
foo
  .bar
  .baz();

​
FunctionDeclaration

Configure function declaration indentation: 
{
  "indent": ["error", 2, {
    "FunctionDeclaration": {
      "parameters": 1,
      "body": 1
    }
  }]
}

​
CallExpression

Configure function call indentation: 
{
  "indent": ["error", 2, {
    "CallExpression": {
      "arguments": 1
    }
  }]
}

​
ignoredNodes

Array of selectors to ignore: 
{
  "indent": ["error", 2, {
    "ignoredNodes": ["ConditionalExpression"]
  }]
}

​
Configuration Examples

// 2 spaces
{
  "rules": {
    "indent": ["error", 2]
  }
}

// 4 spaces  
{
  "rules": {
    "indent": ["error", 4]
  }
}

// Tabs
{
  "rules": {
    "indent": ["error", "tab"]
  }
}

// 2 spaces with switch case indent
{
  "rules": {
    "indent": ["error", 2, { 
      "SwitchCase": 1 
    }]
  }
}

// Complex configuration
{
  "rules": {
    "indent": ["error", 2, {
      "SwitchCase": 1,
      "VariableDeclarator": 1,
      "MemberExpression": 1,
      "FunctionDeclaration": {
        "parameters": 1,
        "body": 1
      },
      "CallExpression": {
        "arguments": 1
      }
    }]
  }
}

​
Common Patterns

​
Switch Statements

// Without SwitchCase: 1
switch (a) {
case 1:
    break;
}

// With SwitchCase: 1 and 2 spaces
switch (a) {
  case 1:
    break;
}

​
Chained Methods

// With MemberExpression: 1 and 2 spaces
chain
  .filter(x => x > 0)
  .map(x => x * 2)
  .forEach(console.log);

​
Multi-line Variables

// With VariableDeclarator: 2 and 2 spaces
var a,
    b,
    c;

​
When Not to Use It

Most modern projects use Prettier for formatting. If you use Prettier, disable this rule.
Disable if:
  • You use Prettier or another formatter
  • You don’t want to enforce indentation
  • Your team hasn’t agreed on indentation style