为什么递归函数会触发ESLint的no-unused-vars规则报错？

错误原因 #

ESLint 内置的no-unused-vars规则无法识别函数内部的递归自引用属于有效变量使用场景，如果你正在使用TypeScript，内置规则本身不支持TypeScript语法解析，也会引发这类误判。

可复现示例代码 #

const factorial = (x: number) => {
  if (x === 0) return 1;

  return x * factorial(x - 1);
};

报错截图 #

修复方案 #

• 方案1：更换适配TypeScript的校验规则（推荐）
  首先确保你已经安装@typescript-eslint/eslint-plugin、@typescript-eslint/parser依赖，随后修改ESLint配置文件，关闭内置规则，启用TypeScript ESLint提供的no-unused-vars规则：

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

• 方案2：临时忽略单条规则校验
  如果你不想修改全局规则，可以在递归函数声明上方加单行忽略注释：

  // eslint-disable-next-line no-unused-vars
  const factorial = (x: number) => {
    if (x === 0) return 1;
    return x * factorial(x - 1);
  };
  

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