Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug]: flat config crash when using manual plugin def and recommended config #3693

Closed
2 tasks done
bradzacher opened this issue Feb 21, 2024 · 3 comments · Fixed by #3694
Closed
2 tasks done

[Bug]: flat config crash when using manual plugin def and recommended config #3693

bradzacher opened this issue Feb 21, 2024 · 3 comments · Fixed by #3694

Comments

@bradzacher
Copy link
Contributor

bradzacher commented Feb 21, 2024

Is there an existing issue for this?

  • I have searched the existing issues and my issue is unique
  • My issue appears in the command-line and not only in the text editor

Description Overview

Repro

// eslint.config.js
import eslintReact from 'eslint-plugin-react';
import eslintReactRecommended from 'eslint-plugin-react/configs/recommended.js';

export default [
	{
		plugins: {
			react: eslintReact,
		},
	},
	eslintReactRecommended,
];

npx eslint eslint.config.js

Expected

No errors

Actual

Oops! Something went wrong! :(

ESLint: 8.56.0

Error: Key "plugins": Cannot redefine plugin "react".

More Info

When defining a plugin key in the flat config ESLint enforces that you only ever redefine they key with the same plugin. This check is done by comparing by reference -- i.e. configA.plugin.react === configB.plugin.react

eslint-plugin-react fails this check because it defines its "plugin" in two locations:

module.exports = {
deprecatedRules: configAll.plugins.react.deprecatedRules,
rules: allRules,
configs: {
recommended: Object.assign({}, configRecommended, {
parserOptions: configRecommended.languageOptions.parserOptions,
plugins,
}),
all: Object.assign({}, configAll, {
parserOptions: configAll.languageOptions.parserOptions,
plugins,
}),
'jsx-runtime': Object.assign({}, configRuntime, {
parserOptions: configRuntime.languageOptions.parserOptions,
plugins,
}),
},
};

react: {
deprecatedRules,
rules: allRules,
},

For this to work there needs to be exactly 1 copy of the "plugin" defined by the package.
For example:

const plugin = { ... };
plugin.configs = {
  recommended: {
    plugins: { react: plugin },
    rules: { ... },
  },
  all: {
    plugins: { react: plugin },
    rules: { ... },
  },
});

eslint-plugin-react version

v7.33.2

eslint version

v8.56.0

node version

v20.11.0

@me4502
Copy link

me4502 commented Jun 19, 2024

It's also worth noting that this affects using multiple configurations from this plugin too. It prevents using both the flat recommended and jsx-runtime configurations at the time time for example, which is the recommended configuration when using the React 17 JSX transform.

@ljharb
Copy link
Member

ljharb commented Jun 19, 2024

@me4502 at the moment we don't support flat config at all, but indeed it needs to be fixed.

@michaelfaith
Copy link

michaelfaith commented Jul 2, 2024

I believe this is actually to do with the fact that the recommended config defines the plugin, and your config which uses the recommended config is also defining the plugin. It shouldn't have anything to do with plugins being defined in other places in the package. Can you try removing from your config?

{
  plugins: {
    react: eslintReact,
  },
},

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Development

Successfully merging a pull request may close this issue.

4 participants