`eslint-config-next` not working with `eslint-plugin-jsx-a11y`

[nirnejak]

Link to the code that reproduces this issue

https://github.com/nirnejak/nextjs-typescript-starter

To Reproduce

After setting up eslint-plugin-jsx-a11y with ESLint 9 in flat file configuration. Running the npm run lint or npx next lint gives the following error

Config "jsx-a11y/recommended": Key "plugins": Cannot redefine plugin "jsx-a11y".

The ESLint config file

import { dirname } from "path"
import { fileURLToPath } from "url"
import { FlatCompat } from "@eslint/eslintrc"

import globals from "globals"
import eslint from "@eslint/js"
import tseslint from "typescript-eslint"
import love from "eslint-config-love"

import nodePlugin from "eslint-plugin-n"
import pluginPromise from "eslint-plugin-promise"

import jsxA11y from "eslint-plugin-jsx-a11y"
import tailwind from "eslint-plugin-tailwindcss"
import eslintPluginPrettierRecommended from "eslint-plugin-prettier/recommended"

const compat = new FlatCompat({
  baseDirectory: dirname(fileURLToPath(import.meta.url)),
})

export default tseslint.config(
  { files: ["**/*.{js,jsx,mjs,cjs,ts,tsx}"] },
  {
    languageOptions: {
      parser: tseslint.parser,
      parserOptions: {
        projectService: true,
        tsconfigRootDir: import.meta.dirname,
      },

      globals: globals.node,
      sourceType: "module",
      ecmaVersion: "latest",
    },
  },

  eslint.configs.recommended,
  tseslint.configs.recommended,
  { ...love, files: ["**/*.js", "**/*.ts"] },

  {
    ...nodePlugin.configs["flat/recommended-script"],
    rules: {
      "n/no-missing-import": [
        "error",
        {
          ignoreTypeImport: true,
          tryExtensions: [".ts", ".tsx", ".js", ".jsx", ".json"],
        },
      ],
    },
  },
  pluginPromise.configs["flat/recommended"],

  ...compat.extends("next/core-web-vitals", "next"),
  jsxA11y.flatConfigs.recommended,

  ...tailwind.configs["flat/recommended"],
  eslintPluginPrettierRecommended
)

Current vs. Expected behavior

The linter show work, currently it's broken,

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 24.2.0: Fri Dec  6 18:51:28 PST 2024; root:xnu-11215.61.5~2/RELEASE_ARM64_T8112
  Available memory (MB): 8192
  Available CPU cores: 8
Binaries:
  Node: 22.11.0
  npm: 10.9.0
  Yarn: 4.4.0
  pnpm: 9.15.0
Relevant Packages:
  next: 15.1.1
  eslint-config-next: 15.1.1
  react: 19.0.0
  react-dom: 19.0.0
  typescript: 5.7.2
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

Linting

Which stage(s) are affected? (Select all that apply)

Other (Deployed)

Additional context

The code works without configuring eslint-plugin-jsx-a11y

[nirnejak]

Found a fix, configuring it like this is working

...
{
    plugins: { "jsx-a11y": jsxA11y },
    rules: jsxA11y.configs.recommended.rules,
},
...

[github-actions]

This closed issue has been automatically locked because it had no new activity for 2 weeks. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.