TypeScript声明enum时触发eslint(no-shadow)上级作用域已声明错误怎么办

错误触发原因 #

该错误是原生ESLint的no-shadow规则与TypeScript语法不兼容导致的误报：

• TypeScript中的枚举属于同时存在于类型作用域和运行时变量作用域的特殊语法，原生ESLint的no-shadow规则无法识别TypeScript的类型作用域逻辑，会错误将枚举的声明本身判定为和上层作用域的标识符重复。
• 通常出现该问题的项目都只开启了原生ESLint的no-shadow规则，没有使用适配TypeScript的@typescript-eslint系列规则。

修复方案 #

方案1：调整ESLint全局配置（推荐，长期生效） #

该方案可以从根本上解决所有TS语法的no-shadow误报问题：

1. 确保项目已安装@typescript-eslint/eslint-plugin和@typescript-eslint/parser依赖，这是TypeScript项目接入ESLint的必备依赖。
2. 修改项目根目录下的ESLint配置文件（.eslintrc.js、.eslintrc.json等），关闭原生no-shadow规则，启用@typescript-eslint提供的同名适配规则：

{
  "parser": "@typescript-eslint/parser",
  "plugins": ["@typescript-eslint"],
  "rules": {
    "no-shadow": "off",
    "@typescript-eslint/no-shadow": "error"
  }
}

3. 重启VS Code的ESLint服务（右键右下角ESLint图标选择重启ESLint服务器，或直接重启编辑器）即可消除误报。

方案2：行内临时忽略错误 #

如果不想修改全局规则，仅需要消除当前文件的报错，可以在枚举定义的上一行添加忽略注释：

// eslint-disable-next-line no-shadow
export enum ItemType {
  Case = 'Case',
  Study = 'Study',
  Project = 'Project',
  Item = 'Item',
}

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