ESLint不允许4空格缩进求助：配置后仍报2空格预期警告

看样子你明明配置了4空格缩进，但ESLint还是揪着2空格的规则不放，大概率是规则配置没覆盖到位，或者Vue插件的优先级问题，试试下面的分步方案：

1. 修正.eslintrc.js的核心配置 #

确保你的配置文件同时覆盖基础JS缩进规则和Vue文件的缩进规则，两者必须保持一致：

module.exports = {
  // 基础环境配置（按需调整）
  env: {
    browser: true,
    es2021: true,
    node: true
  },
  // 指定Vue文件的解析器
  parser: 'vue-eslint-parser',
  parserOptions: {
    parser: '@babel/eslint-parser', // 若用TypeScript则替换为@typescript-eslint/parser
    sourceType: 'module'
  },
  // 启用Vue插件
  plugins: ['vue'],
  // 关键规则配置
  rules: {
    // 基础JS文件的缩进规则：指定4空格
    'indent': ['warn', 4, {
      SwitchCase: 1, // switch语句case的缩进
      ignoredNodes: ['TemplateLiteral *'] // 忽略模板字符串内的缩进
    }],
    // Vue单文件的脚本部分缩进规则：必须和上面的4空格匹配
    'vue/script-indent': ['warn', 4, {
      baseIndent: 1,
      switchCase: 1,
      ignores: []
    }],
    // 可选：关闭Vue模板部分的缩进检查（如果不需要）
    // 'vue/html-indent': ['warn', 4] // 若需要模板也用4空格，就打开这条
  }
}

2. 排查依赖与缓存问题 #

• 确认eslint-plugin-vue是适配你Vue版本的最新版（Vue3建议v9+），可以重新安装依赖：

  npm install eslint eslint-plugin-vue @babel/eslint-parser --save-dev
  

• 重启编辑器的ESLint服务（比如VS Code按Ctrl+Shift+P，输入ESLint: Restart ESLint Server），缓存会导致配置不及时生效。

3. 检查配置冲突 #

看看项目根目录有没有其他ESLint配置文件（比如.eslintrc.json、package.json里的eslintConfig字段），这些文件的优先级可能会覆盖你的.eslintrc.js。

临时验证方案 #

如果想快速确认是规则问题，可在_nav.js顶部加一行注释临时禁用缩进检查：

/* eslint-disable indent */
export default {
    items: [{ // 4空格缩进不会再触发警告
        // ...
    }]
}

这只是临时手段，还是建议把全局配置调对哦。

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