VSCode中使用ESLint时Tab被识别为4空格该如何解决？

该问题本质是校验规则和编辑器输入配置不匹配导致的，仅index.js触发说明是文件级别的配置覆盖了全局设置，常见触发原因如下：

• ESLint的缩进规则默认按空格校验，未明确指定适配制表符
• VS Code针对JavaScript文件的单独配置覆盖了全局editor.insertSpaces设置
• 项目内存在EditorConfig、Prettier等其他格式化工具，规则优先级高于全局编辑器配置

• 调整ESLint缩进规则，在项目根目录的ESLint配置文件（.eslintrc.js、.eslintrc.json等）中新增如下配置，明确指定用制表符做缩进校验：

module.exports = {
  rules: {
    // 错误级别设为2（报错），缩进类型指定为tab
    "indent": ["error", "tab"],
    // 关闭禁止用制表符的规则，避免额外报错
    "no-tabs": "off"
  }
}

• 检查VS Code文件级专属配置，按Ctrl+Shift+P（Mac系统为Command+Shift+P）输入「打开工作区设置(JSON)」，确认JS文件的缩进配置正确：

"[javascript]": {
  "editor.insertSpaces": false,
  // 关闭自动检测缩进，避免编辑器自动按现有内容切换为空格缩进
  "editor.detectIndentation": false
}

• 若项目根目录存在.editorconfig文件，调整JS文件的缩进配置：

[*.js]
indent_style = tab
indent_size = 4

• 若同时使用Prettier等格式化工具，在.prettierrc配置文件中新增适配配置：

{
  "useTabs": true,
  "tabWidth": 4
}

• 所有配置修改完成后，按Ctrl+Shift+P输入ESLint: Restart ESLint Server重启ESLint服务，重新打开index.js即可生效。如果仍有异常，点击VS Code状态栏右下角的缩进标识，手动选择「缩进使用制表符」即可。

内容的提问来源于stack exchange，提问作者johng3587