From 2692c07801348f1d3f5da644955993c84fcd991c Mon Sep 17 00:00:00 2001 From: Brad Zacher Date: Thu, 22 Feb 2024 08:36:30 +1030 Subject: [PATCH] [Fix] export flat configs from plugin root and fix flat config crash --- README.md | 29 +++++++++-------------------- index.js | 13 ++++++++++++- lib/rules/index.js | 2 +- 3 files changed, 22 insertions(+), 22 deletions(-) diff --git a/README.md b/README.md index 64e57912a1..b6edcf4f23 100644 --- a/README.md +++ b/README.md @@ -203,27 +203,16 @@ Refer to the [official docs](https://eslint.org/docs/latest/user-guide/configuri The schema of the `settings.react` object would be identical to that of what's already described above in the legacy config section. -### Shareable configs - -There're also 3 shareable configs. - -- `eslint-plugin-react/configs/all` -- `eslint-plugin-react/configs/recommended` -- `eslint-plugin-react/configs/jsx-runtime` - -If your eslint.config.js is ESM, include the `.js` extension (e.g. `eslint-plugin-react/recommended.js`). Note that the next semver-major will require omitting the extension for these imports. - -**Note**: These configurations will import `eslint-plugin-react` and enable JSX in [`languageOptions.parserOptions`](https://eslint.org/docs/latest/user-guide/configuring/configuration-files-new#configuration-objects). +### Flat Configs -In the new config system, `plugin:` protocol(e.g. `plugin:react/recommended`) is no longer valid. -As eslint does not automatically import the preset config (shareable config), you explicitly do it by yourself. +The flat configs are available via the root plugin import. They will configure the plugin under the `react/` namespace and enable JSX in [`languageOptions.parserOptions`](https://eslint.org/docs/latest/user-guide/configuring/configuration-files-new#configuration-objects). ```js -const reactRecommended = require('eslint-plugin-react/configs/recommended'); +const reactPlugin = require('eslint-plugin-react'); module.exports = [ … - reactRecommended, // This is not a plugin object, but a shareable config object + reactPlugin.configs['flat/recommended'], // This is not a plugin object, but a shareable config object … ]; ``` @@ -234,16 +223,16 @@ You can of course add/override some properties. For most of the cases, you probably want to configure some properties by yourself. ```js -const reactRecommended = require('eslint-plugin-react/configs/recommended'); +const reactPlugin = require('eslint-plugin-react'); const globals = require('globals'); module.exports = [ … { files: ['**/*.{js,mjs,cjs,jsx,mjsx,ts,tsx,mtsx}'], - ...reactRecommended, + ...reactPlugin.configs['flat/recommended'], languageOptions: { - ...reactRecommended.languageOptions, + ...reactPlugin.configs['flat/recommended'].languageOptions, globals: { ...globals.serviceworker, ...globals.browser, @@ -257,14 +246,14 @@ module.exports = [ The above example is same as the example below, as the new config system is based on chaining. ```js -const reactRecommended = require('eslint-plugin-react/configs/recommended'); +const reactPlugin = require('eslint-plugin-react'); const globals = require('globals'); module.exports = [ … { files: ['**/*.{js,mjs,cjs,jsx,mjsx,ts,tsx,mtsx}'], - ...reactRecommended, + ...reactPlugin.configs['flat/recommended'], }, { files: ['**/*.{js,mjs,cjs,jsx,mjsx,ts,tsx,mtsx}'], diff --git a/index.js b/index.js index 4140c6c881..e6bb51593d 100644 --- a/index.js +++ b/index.js @@ -11,7 +11,7 @@ const plugins = [ 'react', ]; -module.exports = { +const plugin = { deprecatedRules: configAll.plugins.react.deprecatedRules, rules: allRules, configs: { @@ -27,5 +27,16 @@ module.exports = { parserOptions: configRuntime.languageOptions.parserOptions, plugins, }), + + 'flat/recommended': Object.assign({}, configRecommended), + 'flat/all': Object.assign({}, configAll), + 'flat/jsx-runtime': Object.assign({}, configRuntime), }, }; + +// need to ensure the flat configs reference the same plugin identity +plugin.configs['flat/recommended'].plugins.react = plugin; +plugin.configs['flat/all'].plugins.react = plugin; +plugin.configs['flat/recommended'].plugins.react = plugin; + +module.exports = plugin; diff --git a/lib/rules/index.js b/lib/rules/index.js index 784831bba7..c30dc6e609 100644 --- a/lib/rules/index.js +++ b/lib/rules/index.js @@ -2,7 +2,7 @@ /* eslint global-require: 0 */ -/** @type {Record} */ +/** @satisfies {Record} */ module.exports = { 'boolean-prop-naming': require('./boolean-prop-naming'), 'button-has-type': require('./button-has-type'),