如何在Next.js项目中添加TypeScript规则且保留next/core-web-vitals

问题根源是你手动指定了parser和plugins字段，这会覆盖next/core-web-vitals内置的TypeScript ESLint集成配置，导致Next.js的默认规则失效。实际上next/core-web-vitals已经包含了@typescript-eslint/parser和@typescript-eslint/eslint-plugin的必要配置，无需重复设置。

正确配置方案 #

修改你的.eslintrc.json，删除手动添加的parser和plugins字段，保留next/core-web-vitals并按需添加TypeScript规则：

{
  "extends": "next/core-web-vitals",
  "rules": {
    "@typescript-eslint/no-explicit-any": "warn"
  }
}

如果需要启用更多TypeScript官方推荐规则，可以将@typescript-eslint/recommended加入extends数组：

{
  "extends": [
    "next/core-web-vitals",
    "@typescript-eslint/recommended"
  ],
  "rules": {
    "@typescript-eslint/no-explicit-any": "warn"
  }
}

验证 #

运行next lint或npm run lint命令，此时next/core-web-vitals的默认规则与你添加的no-explicit-any规则会同时生效。

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