indent-legacy

強制一致的縮排

ESLint 4.0.0 引入了 indent 規則的重寫，現在比以前的版本報告更多錯誤。為了簡化遷移到 4.0.0 的過程，引入了 indent-legacy 規則作為 ESLint 3.x 中 indent 規則的快照。如果您的建置在升級到 4.0.0 後失敗，您可以停用 indent 並啟用 indent-legacy 作為快速修復。最終，您應該切換回 indent 規則，以在未來的版本中獲得錯誤修正和改進。

有幾個常見的指南要求對巢狀區塊和陳述式進行特定的縮排，例如

function hello(indentSize, type) {
    if (indentSize === 4 && type !== 'tab') {
        console.log('Each next indentation will increase on 4 spaces');
    }
}
1
2
3
4
5

這些是不同風格指南中推薦的最常見情境

• 兩個空格，不要更長，且沒有 tab：Google、npm、Node.js、Idiomatic、Felix
• Tab：jQuery
• 四個空格：Crockford

規則詳情

此規則強制執行一致的縮排風格。預設風格為 4 個空格。

選項

此規則有一個混合選項

例如，對於 2 個空格的縮排

{
    "indent-legacy": ["error", 2]
}
1
2
3

或對於 tab 縮排

{
    "indent-legacy": ["error", "tab"]
}
1
2
3

此規則使用預設選項的錯誤程式碼範例

/*eslint indent-legacy: "error"*/

if (a) {
  b=c;
  function foo(d) {
    e=f;
  }
}
1
2
3
4
5
6
7
8

此規則使用預設選項的正確程式碼範例

/*eslint indent-legacy: "error"*/

if (a) {
    b=c;
    function foo(d) {
        e=f;
    }
}
1
2
3
4
5
6
7
8

此規則有一個物件選項

• "SwitchCase"（預設值：0）強制執行 switch 陳述式中 case 子句的縮排層級
• "VariableDeclarator"（預設值：1）強制執行 var 宣告器的縮排層級；也可以使用物件來為 var、let 和 const 宣告定義個別規則。
• "outerIIFEBody"（預設值：1）強制執行檔案層級 IIFE 的縮排層級。
• "MemberExpression"（預設為關閉）強制執行多行屬性鏈的縮排層級（變數宣告和賦值除外）
• "FunctionDeclaration" 接受一個物件來定義函數宣告的規則。
  • parameters（預設為關閉）強制執行函數宣告中參數的縮排層級。這可以是表示縮排層級的數字，或字串 "first"，表示宣告的所有參數都必須與第一個參數對齊。
  • body（預設值：1）強制執行函數宣告主體的縮排層級。
• "FunctionExpression" 接受一個物件來定義函數表達式的規則。
  • parameters（預設為關閉）強制執行函數表達式中參數的縮排層級。這可以是表示縮排層級的數字，或字串 "first"，表示表達式的所有參數都必須與第一個參數對齊。
  • body（預設值：1）強制執行函數表達式主體的縮排層級。
• "CallExpression" 接受一個物件來定義函數呼叫表達式的規則。
  • arguments（預設為關閉）強制執行呼叫表達式中引數的縮排層級。這可以是表示縮排層級的數字，或字串 "first"，表示表達式的所有引數都必須與第一個引數對齊。
• "ArrayExpression"（預設值：1）強制執行陣列中元素的縮排層級。它也可以設定為字串 "first"，表示陣列中的所有元素都應與第一個元素對齊。
• "ObjectExpression"（預設值：1）強制執行物件中屬性的縮排層級。它可以設定為字串 "first"，表示物件中的所有屬性都應與第一個屬性對齊。

縮排層級表示指定縮排的倍數。範例

• 縮排為 4 個空格，VariableDeclarator 設定為 2 將使多行變數宣告縮排 8 個空格。
• 縮排為 2 個空格，VariableDeclarator 設定為 2 將使多行變數宣告縮排 4 個空格。
• 縮排為 2 個空格，VariableDeclarator 設定為 {"var": 2, "let": 2, "const": 3} 將使多行變數宣告對於 var 和 let 縮排 4 個空格，對於 const 陳述式縮排 6 個空格。
• 縮排為 tab，VariableDeclarator 設定為 2 將使多行變數宣告縮排 2 個 tab。
• 縮排為 2 個空格，SwitchCase 設定為 0 將不會相對於 switch 陳述式縮排 case 子句。
• 縮排為 2 個空格，SwitchCase 設定為 1 將相對於 switch 陳述式縮排 case 子句 2 個空格。
• 縮排為 2 個空格，SwitchCase 設定為 2 將相對於 switch 陳述式縮排 case 子句 4 個空格。
• 縮排為 tab，SwitchCase 設定為 2 將相對於 switch 陳述式縮排 case 子句 2 個 tab。
• 縮排為 2 個空格，MemberExpression 設定為 0 將使多行屬性鏈縮排 0 個空格。
• 縮排為 2 個空格，MemberExpression 設定為 1 將使多行屬性鏈縮排 2 個空格。
• 縮排為 2 個空格，MemberExpression 設定為 2 將使多行屬性鏈縮排 4 個空格。
• 縮排為 4 個空格，MemberExpression 設定為 0 將使多行屬性鏈縮排 0 個空格。
• 縮排為 4 個空格，MemberExpression 設定為 1 將使多行屬性鏈縮排 4 個空格。
• 縮排為 4 個空格，MemberExpression 設定為 2 將使多行屬性鏈縮排 8 個空格。

tab

此規則使用 "tab" 選項的錯誤程式碼範例

/*eslint indent-legacy: ["error", "tab"]*/

if (a) {
     b=c;
function foo(d) {
           e=f;
 }
}
1
2
3
4
5
6
7
8

此規則使用 "tab" 選項的正確程式碼範例

/*eslint indent-legacy: ["error", "tab"]*/

if (a) {
	b=c;
	function foo(d) {
		e=f;
	}
}
1
2
3
4
5
6
7
8

SwitchCase

此規則使用 2, { "SwitchCase": 1 } 選項的錯誤程式碼範例

/*eslint indent-legacy: ["error", 2, { "SwitchCase": 1 }]*/

switch(a){
case "a":
    break;
case "b":
    break;
}
1
2
3
4
5
6
7
8

此規則使用 2, { "SwitchCase": 1 } 選項的正確程式碼範例

/*eslint indent-legacy: ["error", 2, { "SwitchCase": 1 }]*/

switch(a){
  case "a":
    break;
  case "b":
    break;
}
1
2
3
4
5
6
7
8

VariableDeclarator

此規則使用 2, { "VariableDeclarator": 1 } 選項的錯誤程式碼範例

/*eslint indent-legacy: ["error", 2, { "VariableDeclarator": 1 }]*/

var a,
    b,
    c;
let d,
    e,
    f;
const g = 1,
    h = 2,
    i = 3;
1
2
3
4
5
6
7
8
9
10
11

此規則使用 2, { "VariableDeclarator": 1 } 選項的正確程式碼範例

/*eslint indent-legacy: ["error", 2, { "VariableDeclarator": 1 }]*/

var a,
  b,
  c;
let d,
  e,
  f;
const g = 1,
  h = 2,
  i = 3;
1
2
3
4
5
6
7
8
9
10
11

此規則使用 2, { "VariableDeclarator": 2 } 選項的正確程式碼範例

/*eslint indent-legacy: ["error", 2, { "VariableDeclarator": 2 }]*/

var a,
    b,
    c;
let d,
    e,
    f;
const g = 1,
    h = 2,
    i = 3;
1
2
3
4
5
6
7
8
9
10
11

此規則使用 2, { "VariableDeclarator": { "var": 2, "let": 2, "const": 3 } } 選項的正確程式碼範例

/*eslint indent-legacy: ["error", 2, { "VariableDeclarator": { "var": 2, "let": 2, "const": 3 } }]*/

var a,
    b,
    c;
let e,
    f,
    g;
const h = 1,
      i = 2,
      j = 3;
1
2
3
4
5
6
7
8
9
10
11

outerIIFEBody

此規則使用選項 2, { "outerIIFEBody": 0 } 的錯誤程式碼範例

/*eslint indent-legacy: ["error", 2, { "outerIIFEBody": 0 }]*/

(function() {

  function foo(x) {
    return x + 1;
  }

})();

if(y) {
console.log('foo');
}
1
2
3
4
5
6
7
8
9
10
11
12
13

此規則使用選項 2, {"outerIIFEBody": 0} 的正確程式碼範例

/*eslint indent-legacy: ["error", 2, { "outerIIFEBody": 0 }]*/

(function() {

function foo(x) {
  return x + 1;
}

})();

if(y) {
  console.log('foo');
}
1
2
3
4
5
6
7
8
9
10
11
12
13

MemberExpression

此規則使用 2, { "MemberExpression": 1 } 選項的錯誤程式碼範例

/*eslint indent-legacy: ["error", 2, { "MemberExpression": 1 }]*/

foo
.bar
.baz()
1
2
3
4
5

此規則使用 2, { "MemberExpression": 1 } 選項的正確程式碼範例

/*eslint indent-legacy: ["error", 2, { "MemberExpression": 1 }]*/

foo
  .bar
  .baz();

// Any indentation is permitted in variable declarations and assignments.
var bip = aardvark.badger
                  .coyote;
1
2
3
4
5
6
7
8
9

FunctionDeclaration

此規則使用 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} } 選項的錯誤程式碼範例

/*eslint indent-legacy: ["error", 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }]*/

function foo(bar,
  baz,
  qux) {
    qux();
}
1
2
3
4
5
6
7

此規則使用 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} } 選項的正確程式碼範例

/*eslint indent-legacy: ["error", 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }]*/

function foo(bar,
    baz,
    qux) {
  qux();
}
1
2
3
4
5
6
7

此規則使用 2, { "FunctionDeclaration": {"parameters": "first"} } 選項的錯誤程式碼範例

/*eslint indent-legacy: ["error", 2, {"FunctionDeclaration": {"parameters": "first"}}]*/

function foo(bar, baz,
  qux, boop) {
  qux();
}
1
2
3
4
5
6

此規則使用 2, { "FunctionDeclaration": {"parameters": "first"} } 選項的正確程式碼範例

/*eslint indent-legacy: ["error", 2, {"FunctionDeclaration": {"parameters": "first"}}]*/

function foo(bar, baz,
             qux, boop) {
  qux();
}
1
2
3
4
5
6

FunctionExpression

此規則使用 2, { "FunctionExpression": {"body": 1, "parameters": 2} } 選項的錯誤程式碼範例

/*eslint indent-legacy: ["error", 2, { "FunctionExpression": {"body": 1, "parameters": 2} }]*/

var foo = function(bar,
  baz,
  qux) {
    qux();
}
1
2
3
4
5
6
7

此規則使用 2, { "FunctionExpression": {"body": 1, "parameters": 2} } 選項的正確程式碼範例

/*eslint indent-legacy: ["error", 2, { "FunctionExpression": {"body": 1, "parameters": 2} }]*/

var foo = function(bar,
    baz,
    qux) {
  qux();
}
1
2
3
4
5
6
7

此規則使用 2, { "FunctionExpression": {"parameters": "first"} } 選項的錯誤程式碼範例

/*eslint indent-legacy: ["error", 2, {"FunctionExpression": {"parameters": "first"}}]*/

var foo = function(bar, baz,
  qux, boop) {
  qux();
}
1
2
3
4
5
6

此規則使用 2, { "FunctionExpression": {"parameters": "first"} } 選項的正確程式碼範例

/*eslint indent-legacy: ["error", 2, {"FunctionExpression": {"parameters": "first"}}]*/

var foo = function(bar, baz,
                   qux, boop) {
  qux();
}
1
2
3
4
5
6

CallExpression

此規則使用 2, { "CallExpression": {"arguments": 1} } 選項的錯誤程式碼範例

/*eslint indent-legacy: ["error", 2, { "CallExpression": {"arguments": 1} }]*/

foo(bar,
    baz,
      qux
);
1
2
3
4
5
6

此規則使用 2, { "CallExpression": {"arguments": 1} } 選項的正確程式碼範例

/*eslint indent-legacy: ["error", 2, { "CallExpression": {"arguments": 1} }]*/

foo(bar,
  baz,
  qux
);
1
2
3
4
5
6

此規則使用 2, { "CallExpression": {"arguments": "first"} } 選項的錯誤程式碼範例

/*eslint indent-legacy: ["error", 2, {"CallExpression": {"arguments": "first"}}]*/

foo(bar, baz,
  baz, boop, beep);
1
2
3
4

此規則使用 2, { "CallExpression": {"arguments": "first"} } 選項的正確程式碼範例

/*eslint indent-legacy: ["error", 2, {"CallExpression": {"arguments": "first"}}]*/

foo(bar, baz,
    baz, boop, beep);
1
2
3
4

ArrayExpression

此規則使用 2, { "ArrayExpression": 1 } 選項的錯誤程式碼範例

/*eslint indent-legacy: ["error", 2, { "ArrayExpression": 1 }]*/

var foo = [
    bar,
baz,
      qux
];
1
2
3
4
5
6
7

此規則使用 2, { "ArrayExpression": 1 } 選項的正確程式碼範例

/*eslint indent-legacy: ["error", 2, { "ArrayExpression": 1 }]*/

var foo = [
  bar,
  baz,
  qux
];
1
2
3
4
5
6
7

此規則使用 2, { "ArrayExpression": "first" } 選項的錯誤程式碼範例

/*eslint indent-legacy: ["error", 2, {"ArrayExpression": "first"}]*/

var foo = [bar,
  baz,
  qux
];
1
2
3
4
5
6

此規則使用 2, { "ArrayExpression": "first" } 選項的正確程式碼範例

/*eslint indent-legacy: ["error", 2, {"ArrayExpression": "first"}]*/

var foo = [bar,
           baz,
           qux
];
1
2
3
4
5
6

ObjectExpression

此規則使用 2, { "ObjectExpression": 1 } 選項的錯誤程式碼範例

/*eslint indent-legacy: ["error", 2, { "ObjectExpression": 1 }]*/

var foo = {
    bar: 1,
baz: 2,
      qux: 3
};
1
2
3
4
5
6
7

此規則使用 2, { "ObjectExpression": 1 } 選項的正確程式碼範例

/*eslint indent-legacy: ["error", 2, { "ObjectExpression": 1 }]*/

var foo = {
  bar: 1,
  baz: 2,
  qux: 3
};
1
2
3
4
5
6
7

此規則使用 2, { "ObjectExpression": "first" } 選項的錯誤程式碼範例

/*eslint indent-legacy: ["error", 2, {"ObjectExpression": "first"}]*/

var foo = { bar: 1,
  baz: 2 };
1
2
3
4

此規則使用 2, { "ObjectExpression": "first" } 選項的正確程式碼範例

/*eslint indent-legacy: ["error", 2, {"ObjectExpression": "first"}]*/

var foo = { bar: 1,
            baz: 2 };
1
2
3
4

相容性

• JSHint：indent
• JSCS：validateIndentation

版本

此規則在 ESLint v4.0.0-alpha.0 中引入。

資源

• 規則來源
• 測試來源