eslint-plugin-astro icon indicating copy to clipboard operation
eslint-plugin-astro copied to clipboard

plugin incompatible with eslint-plugin-jsx-a11y

Open adamhl8 opened this issue 10 months ago • 2 comments

Before You File a Bug Report Please Confirm You Have Done The Following...

  • [x] I have tried restarting my IDE and the issue persists.
  • [x] I have updated to the latest version of the packages.

What version of ESLint are you using?

9.19.0

What version of eslint-plugin-astro are you using?

0.14.1


In this plugin's flat/jsx-a11y-* configs, it defines the jsx-a11y plugin which conflicts with the normal eslint-plugin-jsx-a11y if installed. This prevents eslint from running.

This is a problem because you can have a project where you have non-astro files that you want to lint with eslint-plugin-jsx-a11y (since this plugin only targets .astro files).

So for example, this does not work:

export default tseslint.config(
  astro.configs["flat/recommended"],
  astro.configs["flat/jsx-a11y-strict"],
  jsxA11y.flatConfigs.strict,
)

You'll get the following error:

Oops! Something went wrong! :(

ESLint: 9.19.0

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

I'm able to work around this by doing the following:

// eslint-plugin-astro defines the "jsx-a11y" plugin which conflicts with the original plugin
// The last config object in astro.configs["flat/jsx-a11y-strict"] is the one that defines the "jsx-a11y" plugin
const baseAstroJsxA11yConfig = astro.configs["flat/jsx-a11y-strict"].slice(0, -1)
// We then grab that last config so we can get the rules and the plugin object
const astroJsxA11yConfig = astro.configs["flat/jsx-a11y-strict"].pop()
const astroJsxA11yPlugin = astroJsxA11yConfig?.plugins?.["jsx-a11y"] ?? {}
const astroJsxA11yRules = astroJsxA11yConfig?.rules ?? {}

export default tseslint.config(
  astro.configs["flat/recommended"],
  {
    extends: [baseAstroJsxA11yConfig],
    plugins: {
      "astro/jsx-a11y": astroJsxA11yPlugin,
    },
    rules: astroJsxA11yRules,
  },
  jsxA11y.flatConfigs.strict,
)

Basically, I'm just renaming the plugin from jsx-a11y to astro/jsx-a11y so there are no conflicts.

Considering that the original jsx-a11y rules are renamed with the astro/ prefix in this plugin, it seems like the plugin name should definitely be astro/jsx-a11y anyway.

adamhl8 avatar Feb 02 '25 07:02 adamhl8

@ota-meshi Here's a simple repo that reproduces the issue: https://github.com/adamhl8/eslint-plugin-astro-466

adamhl8 avatar Feb 02 '25 19:02 adamhl8

Thanks for sharing the repository to reproduce.

Please consider submitting a PR to fix it. It's a bit of a breaking change, so migration documentation might be needed as well.

ota-meshi avatar Feb 12 '25 01:02 ota-meshi