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

feat(eslint-plugin-react-hooks): support flat config #30774

Merged
merged 1 commit into from
Jan 16, 2025

Conversation

michaelfaith
Copy link
Contributor

@michaelfaith michaelfaith commented Aug 21, 2024

I also updated the README to include usage examples.

Example usage:

import reactHooks from 'eslint-plugin-react-hooks';

export default [
 {
    files: ['**/*.{js,jsx}'],
    languageOptions: {
      ecmaVersion: 2020,
      globals: globals.browser,
      parserOptions: {
        ecmaVersion: 'latest',
        ecmaFeatures: {jsx: true},
        sourceType: 'module',
      },
    },
    settings: {react: {version: '18.3'}},
    ...reactHooks.configs['recommended-latest'],
  },
];

Closes #28313

@facebook-github-bot
Copy link

Hi @michaelfaith!

Thank you for your pull request and welcome to our community.

Action Required

In order to merge any pull request (code, docs, etc.), we require contributors to sign our Contributor License Agreement, and we don't seem to have one on file for you.

Process

In order for us to review and merge your suggested changes, please sign at https://code.facebook.com/cla. If you are contributing on behalf of someone else (eg your employer), the individual CLA may not be sufficient and your employer may need to sign the corporate CLA.

Once the CLA is signed, our tooling will perform checks and validations. Afterwards, the pull request will be tagged with CLA signed. The tagging process may take up to 1 hour after signing. Please give it that time before contacting us about it.

If you have received this in error or have any questions, please contact us at [email protected]. Thanks!

Copy link

vercel bot commented Aug 21, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
react-compiler-playground ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 30, 2024 8:52am

@facebook-github-bot
Copy link

Thank you for signing our Contributor License Agreement. We can now accept your code for this (and any) Meta Open Source project. Thanks!

mizdra added a commit to mizdra/eslint-config-mizdra that referenced this pull request Aug 26, 2024
mizdra added a commit to mizdra/eslint-config-mizdra that referenced this pull request Aug 26, 2024
@rakleed
Copy link
Contributor

rakleed commented Sep 4, 2024

@eps1lon @poteto

@Byron2016
Copy link

Hi, any advance with this?

@michaelfaith
Copy link
Contributor Author

Hi, any advance with this?

Not sure. Waiting on someone from the team to look at it.

@NikolajHoggins
Copy link

Might have to direct message Mark at this point

@michaelfaith
Copy link
Contributor Author

@eps1lon with the release of 5.0 and eslint v9 support 🥳 , would it be possible to push this forward now for flat config support? Any feedback would be greatly appreciated.

@eps1lon
Copy link
Collaborator

eps1lon commented Oct 11, 2024

Can you rebase? Seems like CI missed this.

@michaelfaith
Copy link
Contributor Author

michaelfaith commented Oct 11, 2024

Can you rebase? Seems like CI missed this.

Done. And made the adjustment to the index, to remove the new dependency on the rollup plugin.

@eps1lon
Copy link
Collaborator

eps1lon commented Oct 13, 2024

The support for flat config is backwards compatible with ESLint v8 and lower?

@react-sizebot
Copy link

react-sizebot commented Oct 13, 2024

Comparing: 1185f88...1a4ee0f

Critical size changes

Includes critical production bundles, as well as any change greater than 2%:

Name +/- Base Current +/- gzip Base gzip Current gzip
oss-stable/react-dom/cjs/react-dom.production.js = 6.68 kB 6.68 kB = 1.83 kB 1.83 kB
oss-stable/react-dom/cjs/react-dom-client.production.js = 514.24 kB 514.24 kB = 91.74 kB 91.74 kB
oss-experimental/react-dom/cjs/react-dom.production.js = 6.69 kB 6.69 kB = 1.83 kB 1.83 kB
oss-experimental/react-dom/cjs/react-dom-client.production.js = 556.18 kB 556.18 kB = 98.72 kB 98.72 kB
facebook-www/ReactDOM-prod.classic.js = 595.79 kB 595.79 kB = 104.85 kB 104.85 kB
facebook-www/ReactDOM-prod.modern.js = 586.21 kB 586.21 kB = 103.30 kB 103.30 kB
oss-experimental/eslint-plugin-react-hooks/cjs/eslint-plugin-react-hooks.development.js +5.17% 89.94 kB 94.58 kB +2.41% 14.97 kB 15.33 kB
oss-stable-semver/eslint-plugin-react-hooks/cjs/eslint-plugin-react-hooks.development.js +5.15% 87.86 kB 92.39 kB +2.38% 14.73 kB 15.08 kB
oss-stable/eslint-plugin-react-hooks/cjs/eslint-plugin-react-hooks.development.js +5.15% 87.86 kB 92.39 kB +2.38% 14.73 kB 15.08 kB
oss-stable-semver/eslint-plugin-react-hooks/cjs/eslint-plugin-react-hooks.production.js +5.14% 78.52 kB 82.55 kB +2.31% 14.37 kB 14.71 kB
oss-stable/eslint-plugin-react-hooks/cjs/eslint-plugin-react-hooks.production.js +5.14% 78.52 kB 82.55 kB +2.31% 14.37 kB 14.71 kB
oss-experimental/eslint-plugin-react-hooks/cjs/eslint-plugin-react-hooks.production.js +5.13% 80.38 kB 84.50 kB +2.36% 14.63 kB 14.98 kB

Significant size changes

Includes any change greater than 0.2%:

Expand to show
Name +/- Base Current +/- gzip Base gzip Current gzip
oss-experimental/eslint-plugin-react-hooks/cjs/eslint-plugin-react-hooks.development.js +5.17% 89.94 kB 94.58 kB +2.41% 14.97 kB 15.33 kB
oss-stable-semver/eslint-plugin-react-hooks/cjs/eslint-plugin-react-hooks.development.js +5.15% 87.86 kB 92.39 kB +2.38% 14.73 kB 15.08 kB
oss-stable/eslint-plugin-react-hooks/cjs/eslint-plugin-react-hooks.development.js +5.15% 87.86 kB 92.39 kB +2.38% 14.73 kB 15.08 kB
oss-stable-semver/eslint-plugin-react-hooks/cjs/eslint-plugin-react-hooks.production.js +5.14% 78.52 kB 82.55 kB +2.31% 14.37 kB 14.71 kB
oss-stable/eslint-plugin-react-hooks/cjs/eslint-plugin-react-hooks.production.js +5.14% 78.52 kB 82.55 kB +2.31% 14.37 kB 14.71 kB
oss-experimental/eslint-plugin-react-hooks/cjs/eslint-plugin-react-hooks.production.js +5.13% 80.38 kB 84.50 kB +2.36% 14.63 kB 14.98 kB

Generated by 🚫 dangerJS against 4b0aab5

@rakleed
Copy link
Contributor

rakleed commented Dec 3, 2024

@eps1lon could you please give feedback about #30774 (comment)?

@Aluisio
Copy link

Aluisio commented Dec 12, 2024

Hey guys, not to be boring and repetitive, but do we have any updates on this?

Copy link
Member

@poteto poteto left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Left a few minor comments, let's try and get this landed soon. Thanks again for submitting this PR!

packages/eslint-plugin-react-hooks/README.md Outdated Show resolved Hide resolved
packages/eslint-plugin-react-hooks/README.md Outdated Show resolved Hide resolved

/**
* 'recommended' is currently aliased to the legacy / rc recommended config to maintain backwards compatibility.
* In v6, this will switch to alias the flat recommended config.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you add a note that this is deprecated?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks @poteto for the feedback! How does this sound for an updated comment? I didn't annotate it as deprecated, since recommended as a symbol will still exist in the next major, it'll just be aliased to something else. Do you think this captures that?

/**
   * 'recommended' is currently aliased to the legacy / rc recommended config) to maintain backwards compatibility.
   * This is deprecated and in v6, it will switch to alias the flat recommended config.
   */

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah this looks good!

@github-actions github-actions bot added the React Core Team Opened by a member of the React Core Team label Jan 16, 2025
This change adds support for the new flat config format.  I also updated the README to include usage examples.

Example usage:
```js
export default [
 {
    files: ['**/*.{js,jsx}'],
    languageOptions: {
      ecmaVersion: 2020,
      globals: globals.browser,
      parserOptions: {
        ecmaVersion: 'latest',
        ecmaFeatures: {jsx: true},
        sourceType: 'module',
      },
    },
    settings: {react: {version: '18.3'}},
    ...reactHooks.configs['recommended-latest'],
  },
];
```
@michaelfaith
Copy link
Contributor Author

Rebased against main

@poteto
Copy link
Member

poteto commented Jan 16, 2025

Thanks everyone for the patience and also to @michaelfaith for seeing this through!

@poteto poteto merged commit 61e713c into facebook:main Jan 16, 2025
188 checks passed
github-actions bot pushed a commit that referenced this pull request Jan 16, 2025
@michaelfaith michaelfaith deleted the feat/flat-config branch January 16, 2025 23:53
github-actions bot pushed a commit to code/lib-react that referenced this pull request Jan 17, 2025
@karlhorky
Copy link
Contributor

Thanks @poteto, @michaelfaith and everyone else who collaborated here!

Since I see on the npm page for eslint-plugin-react-hooks that the latest version is 5.1.0, I'm guessing the next version with this change will be either a minor or major?

@poteto
Copy link
Member

poteto commented Jan 17, 2025

@karlhorky I'm working with @michaelfaith on merging the compiler's eslint plugin into this one (new rule), so I'm thinking we'll do a minor release after that happens. It's a bit complicated to publish the eslint plugin with our current build scripts so I'd rather do it once

@briavicenti
Copy link

Hey @poteto, any timeline on that release? I have a pending update to eslint v9 for all of my company's repos, but I don't feel great about shipping that knowing that we would (at least for now) lose the react-hooks rules. Would really appreciate this PR being released!

@controversial
Copy link

controversial commented Jan 29, 2025

@briavicenti the plugin supports eslint 9 since v5.0.0; it just doesn’t export a flat config. You can still add the rules from this package to your flat config, and they work great:

import pluginReactHooks from 'eslint-plugin-react-hooks';

export default [
  {
    plugins: {
      'react-hooks': pluginReactHooks,
    },
    rules: {
      'react-hooks/rules-of-hooks': 'error',
      'react-hooks/exhaustive-deps': 'warn',
    },
  },
];

@guillaumebrunerie
Copy link

@briavicenti the plugin supports eslint 9 since v5.0.0; it just doesn’t export a flat config. You can still add the rules from this package to your flat config, and they work great:

Except that the react-hooks/rules-of-hooks rule is pretty broken in v5.1.0 if you use loops (#31687).

@controversial
Copy link

@guillaumebrunerie that bug is unrelated to flat config support, and off-topic for this PR

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed React Core Team Opened by a member of the React Core Team
Projects
None yet
Development

Successfully merging this pull request may close these issues.

eslint-plugin-react-hooks & "Flat Config" (ESLint 9)