indent
强制执行一致的缩进
此规则报告的某些问题可以通过 --fix
命令行 选项自动修复
有几个常见的指南要求对嵌套块和语句进行特定的缩进,例如
function hello(indentSize, type) {
if (indentSize === 4 && type !== 'tab') {
console.log('Each next indentation will increase on 4 spaces');
}
}
这些是不同风格指南中最常见的推荐场景
- 两个空格,不要更长,不要制表符:Google、npm、Node.js、Idiomatic、Felix
- 制表符:jQuery
- 四个空格:Crockford
规则详情
此规则强制执行一致的缩进风格。默认风格是 4 个空格
。
选项
此规则有一个混合选项
例如,对于 2 个空格的缩进
{
"indent": ["error", 2]
}
或者对于制表符缩进
{
"indent": ["error", "tab"]
}
使用默认选项时,此规则的错误代码示例
/*eslint indent: "error"*/
if (a) {
b=c;
function foo(d) {
e=f;
}
}
使用默认选项时,此规则的正确代码示例
/*eslint indent: "error"*/
if (a) {
b=c;
function foo(d) {
e=f;
}
}
此规则有一个对象选项
"ignoredNodes"
可用于禁用对任何 AST 节点的缩进检查。这接受一个 选择器 数组。如果 AST 节点与任何选择器匹配,则将忽略该节点直接子代的标记的缩进。如果不同意规则对特定语法模式强制执行的缩进,则可以将其用作放宽规则的逃生舱。"SwitchCase"
(默认值:0)强制执行switch
语句中case
子句的缩进级别"VariableDeclarator"
(默认值:1)强制执行var
声明符的缩进级别;也可以采用对象来为var
、let
和const
声明定义单独的规则。它也可以是"first"
,表示所有声明符应与第一个声明符对齐。"outerIIFEBody"
(默认值:1)强制执行文件级 IIFE 的缩进级别。也可以将其设置为"off"
以禁用对文件级 IIFE 的检查。"MemberExpression"
(默认值:1)强制执行多行属性链的缩进级别。也可以将其设置为"off"
以禁用对 MemberExpression 缩进的检查。"FunctionDeclaration"
采用对象来定义函数声明的规则。parameters
(默认值:1)强制执行函数声明中参数的缩进级别。它可以是一个数字,表示缩进级别,也可以是字符串"first"
,表示声明的所有参数必须与第一个参数对齐。也可以将其设置为"off"
以禁用对 FunctionDeclaration 参数的检查。body
(默认值:1)强制执行函数声明主体的缩进级别。
"FunctionExpression"
采用对象来定义函数表达式的规则。parameters
(默认值:1)强制执行函数表达式中参数的缩进级别。它可以是一个数字,表示缩进级别,也可以是字符串"first"
,表示表达式的所有参数必须与第一个参数对齐。也可以将其设置为"off"
以禁用对 FunctionExpression 参数的检查。body
(默认值:1)强制执行函数表达式主体的缩进级别。
"StaticBlock"
采用对象来定义类静态块的规则。body
(默认值:1)强制执行类静态块主体的缩进级别。
"CallExpression"
采用对象来定义函数调用表达式的规则。arguments
(默认值:1)强制执行调用表达式中参数的缩进级别。它可以是一个数字,表示缩进级别,也可以是字符串"first"
,表示表达式的所有参数必须与第一个参数对齐。也可以将其设置为"off"
以禁用对 CallExpression 参数的检查。
"ArrayExpression"
(默认值:1)强制执行数组中元素的缩进级别。也可以将其设置为字符串"first"
,表示数组中的所有元素应与第一个元素对齐。也可以将其设置为"off"
以禁用对数组元素的检查。"ObjectExpression"
(默认值:1)强制执行对象中属性的缩进级别。可以将其设置为字符串"first"
,表示对象中的所有属性应与第一个属性对齐。也可以将其设置为"off"
以禁用对对象属性的检查。"ImportDeclaration"
(默认值:1)强制执行导入语句的缩进级别。可以将其设置为字符串"first"
,表示从模块导入的所有成员应与列表中的第一个成员对齐。也可以将其设置为"off"
以禁用对导入模块成员的检查。"flatTernaryExpressions": true
(默认值为false
)要求嵌套在其他三元表达式中的三元表达式不缩进。"offsetTernaryExpressions": true
(默认值为false
)要求三元表达式的值缩进。- 当注释不需要与上一行或下一行上的节点对齐时,可以使用
"ignoreComments"
(默认值:false)。
缩进级别表示指定缩进的倍数。例子
- 缩进 4 个空格,
VariableDeclarator
设置为2
将使多行变量声明缩进 8 个空格。 - 缩进 2 个空格,
VariableDeclarator
设置为2
将使多行变量声明缩进 4 个空格。 - 缩进 2 个空格,
VariableDeclarator
设置为{"var": 2, "let": 2, "const": 3}
将使多行变量声明缩进,var
和let
为 4 个空格,const
语句为 6 个空格。 - 缩进制表符,
VariableDeclarator
设置为2
将使多行变量声明缩进 2 个制表符。 - 缩进 2 个空格,
SwitchCase
设置为0
将不会相对于switch
语句缩进case
子句。 - 缩进 2 个空格,
SwitchCase
设置为1
将相对于switch
语句将case
子句缩进 2 个空格。 - 缩进 2 个空格,
SwitchCase
设置为2
将相对于switch
语句将case
子句缩进 4 个空格。 - 缩进制表符,
SwitchCase
设置为2
将相对于switch
语句将case
子句缩进 2 个制表符。 - 缩进 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: ["error", "tab"]*/
if (a) {
b=c;
function foo(d) {
e=f;
}
}
使用 "tab"
选项时,此规则的正确代码示例
/*eslint indent: ["error", "tab"]*/
if (a) {
b=c;
function foo(d) {
e=f;
}
}
ignoredNodes
以下配置忽略 ConditionalExpression
(“三元表达式”)节点的缩进
使用 4, { "ignoredNodes": ["ConditionalExpression"] }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 4, { "ignoredNodes": ["ConditionalExpression"] }]*/
var a = foo
? bar
: baz;
var a = foo
? bar
: baz;
以下配置忽略 IIFE 主体中的缩进。
使用 4, { "ignoredNodes": ["CallExpression > FunctionExpression.callee > BlockStatement.body"] }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 4, { "ignoredNodes": ["CallExpression > FunctionExpression.callee > BlockStatement.body"] }]*/
(function() {
foo();
bar();
})();
所有 AST 节点类型都可以在 ESTree 规范中找到。您可以使用带有 espree 解析器的 AST Explorer 来检查代码片段的 AST 树。
SwitchCase
使用 2, { "SwitchCase": 1 }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, { "SwitchCase": 1 }]*/
switch(a){
case "a":
break;
case "b":
break;
}
使用 2, { "SwitchCase": 1 }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "SwitchCase": 1 }]*/
switch(a){
case "a":
break;
case "b":
break;
}
VariableDeclarator
使用 2, { "VariableDeclarator": 1 }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, { "VariableDeclarator": 1 }]*/
var a,
b,
c;
let d,
e,
f;
const g = 1,
h = 2,
i = 3;
使用 2, { "VariableDeclarator": 1 }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "VariableDeclarator": 1 }]*/
var a,
b,
c;
let d,
e,
f;
const g = 1,
h = 2,
i = 3;
使用 2, { "VariableDeclarator": 2 }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "VariableDeclarator": 2 }]*/
var a,
b,
c;
let d,
e,
f;
const g = 1,
h = 2,
i = 3;
使用 2, { "VariableDeclarator": "first" }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, { "VariableDeclarator": "first" }]*/
var a,
b,
c;
let d,
e,
f;
const g = 1,
h = 2,
i = 3;
使用 2, { "VariableDeclarator": "first" }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "VariableDeclarator": "first" }]*/
var a,
b,
c;
let d,
e,
f;
const g = 1,
h = 2,
i = 3;
使用 2, { "VariableDeclarator": { "var": 2, "let": 2, "const": 3 } }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "VariableDeclarator": { "var": 2, "let": 2, "const": 3 } }]*/
var a,
b,
c;
let d,
e,
f;
const g = 1,
h = 2,
i = 3;
outerIIFEBody
使用 2, { "outerIIFEBody": 0 }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, { "outerIIFEBody": 0 }]*/
(function() {
function foo(x) {
return x + 1;
}
})();
if (y) {
console.log('foo');
}
使用 2, { "outerIIFEBody": 0 }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "outerIIFEBody": 0 }]*/
(function() {
function foo(x) {
return x + 1;
}
})();
if (y) {
console.log('foo');
}
使用 2, { "outerIIFEBody": "off" }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "outerIIFEBody": "off" }]*/
(function() {
function foo(x) {
return x + 1;
}
})();
(function() {
function foo(x) {
return x + 1;
}
})();
if (y) {
console.log('foo');
}
MemberExpression
使用 2, { "MemberExpression": 1 }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, { "MemberExpression": 1 }]*/
foo
.bar
.baz()
使用 2, { "MemberExpression": 1 }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "MemberExpression": 1 }]*/
foo
.bar
.baz();
FunctionDeclaration
使用 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }]*/
function foo(bar,
baz,
qux) {
qux();
}
使用 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }]*/
function foo(bar,
baz,
qux) {
qux();
}
使用 2, { "FunctionDeclaration": {"parameters": "first"} }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, {"FunctionDeclaration": {"parameters": "first"}}]*/
function foo(bar, baz,
qux, boop) {
qux();
}
使用 2, { "FunctionDeclaration": {"parameters": "first"} }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, {"FunctionDeclaration": {"parameters": "first"}}]*/
function foo(bar, baz,
qux, boop) {
qux();
}
FunctionExpression
使用 2, { "FunctionExpression": {"body": 1, "parameters": 2} }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, { "FunctionExpression": {"body": 1, "parameters": 2} }]*/
var foo = function(bar,
baz,
qux) {
qux();
}
使用 2, { "FunctionExpression": {"body": 1, "parameters": 2} }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "FunctionExpression": {"body": 1, "parameters": 2} }]*/
var foo = function(bar,
baz,
qux) {
qux();
}
使用 2, { "FunctionExpression": {"parameters": "first"} }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, {"FunctionExpression": {"parameters": "first"}}]*/
var foo = function(bar, baz,
qux, boop) {
qux();
}
使用 2, { "FunctionExpression": {"parameters": "first"} }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, {"FunctionExpression": {"parameters": "first"}}]*/
var foo = function(bar, baz,
qux, boop) {
qux();
}
StaticBlock
使用 2, { "StaticBlock": {"body": 1} }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, { "StaticBlock": {"body": 1} }]*/
class C {
static {
foo();
}
}
使用 2, { "StaticBlock": {"body": 1} }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "StaticBlock": {"body": 1} }]*/
class C {
static {
foo();
}
}
使用 2, { "StaticBlock": {"body": 2} }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, { "StaticBlock": {"body": 2} }]*/
class C {
static {
foo();
}
}
使用 2, { "StaticBlock": {"body": 2} }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "StaticBlock": {"body": 2} }]*/
class C {
static {
foo();
}
}
CallExpression
使用 2, { "CallExpression": {"arguments": 1} }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, { "CallExpression": {"arguments": 1} }]*/
foo(bar,
baz,
qux
);
使用 2, { "CallExpression": {"arguments": 1} }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "CallExpression": {"arguments": 1} }]*/
foo(bar,
baz,
qux
);
使用 2, { "CallExpression": {"arguments": "first"} }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, {"CallExpression": {"arguments": "first"}}]*/
foo(bar, baz,
baz, boop, beep);
使用 2, { "CallExpression": {"arguments": "first"} }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, {"CallExpression": {"arguments": "first"}}]*/
foo(bar, baz,
baz, boop, beep);
ArrayExpression
使用 2, { "ArrayExpression": 1 }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, { "ArrayExpression": 1 }]*/
var foo = [
bar,
baz,
qux
];
使用 2, { "ArrayExpression": 1 }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "ArrayExpression": 1 }]*/
var foo = [
bar,
baz,
qux
];
使用 2, { "ArrayExpression": "first" }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, {"ArrayExpression": "first"}]*/
var foo = [bar,
baz,
qux
];
使用 2, { "ArrayExpression": "first" }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, {"ArrayExpression": "first"}]*/
var foo = [bar,
baz,
qux
];
ObjectExpression
使用 2, { "ObjectExpression": 1 }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, { "ObjectExpression": 1 }]*/
var foo = {
bar: 1,
baz: 2,
qux: 3
};
使用 2, { "ObjectExpression": 1 }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "ObjectExpression": 1 }]*/
var foo = {
bar: 1,
baz: 2,
qux: 3
};
使用 2, { "ObjectExpression": "first" }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, {"ObjectExpression": "first"}]*/
var foo = { bar: 1,
baz: 2 };
使用 2, { "ObjectExpression": "first" }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, {"ObjectExpression": "first"}]*/
var foo = { bar: 1,
baz: 2 };
ImportDeclaration
使用 4, { "ImportDeclaration": 1 }
选项(默认值)时,此规则的正确代码示例
/*eslint indent: ["error", 4, { "ImportDeclaration": 1 }]*/
import { foo,
bar,
baz,
} from 'qux';
/*eslint indent: ["error", 4, { "ImportDeclaration": 1 }]*/
import {
foo,
bar,
baz,
} from 'qux';
使用 4, { "ImportDeclaration": "first" }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 4, { "ImportDeclaration": "first" }]*/
import { foo,
bar,
baz,
} from 'qux';
使用 4, { "ImportDeclaration": "first" }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 4, { "ImportDeclaration": "first" }]*/
import { foo,
bar,
baz,
} from 'qux';
flatTernaryExpressions
使用默认的 4, { "flatTernaryExpressions": false }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 4, { "flatTernaryExpressions": false }]*/
var a =
foo ? bar :
baz ? qux :
boop;
使用默认的 4, { "flatTernaryExpressions": false }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 4, { "flatTernaryExpressions": false }]*/
var a =
foo ? bar :
baz ? qux :
boop;
使用 4, { "flatTernaryExpressions": true }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 4, { "flatTernaryExpressions": true }]*/
var a =
foo ? bar :
baz ? qux :
boop;
使用 4, { "flatTernaryExpressions": true }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 4, { "flatTernaryExpressions": true }]*/
var a =
foo ? bar :
baz ? qux :
boop;
offsetTernaryExpressions
使用默认的 2, { "offsetTernaryExpressions": false }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, { "offsetTernaryExpressions": false }]*/
condition
? () => {
return true
}
: () => {
false
}
使用默认的 2, { "offsetTernaryExpressions": false }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "offsetTernaryExpressions": false }]*/
condition
? () => {
return true
}
: condition2
? () => {
return true
}
: () => {
return false
}
使用 2, { "offsetTernaryExpressions": true }
选项时,此规则的错误代码示例
/*eslint indent: ["error", 2, { "offsetTernaryExpressions": true }]*/
condition
? () => {
return true
}
: condition2
? () => {
return true
}
: () => {
return false
}
使用 2, { "offsetTernaryExpressions": true }
选项时,此规则的正确代码示例
/*eslint indent: ["error", 2, { "offsetTernaryExpressions": true }]*/
condition
? () => {
return true
}
: condition2
? () => {
return true
}
: () => {
return false
}
ignoreComments
使用 4, { "ignoreComments": true }
选项时,其他正确代码示例
/*eslint indent: ["error", 4, { "ignoreComments": true }] */
if (foo) {
doSomething();
// comment intentionally de-indented
doSomethingElse();
}
兼容性
- JSHint:
indent
- JSCS: validateIndentation
版本
此规则在 ESLint v0.14.0 中引入。