When I tried the config snippet in the question by @Jonathan Kasser, I got an error: TypeError: context.getSource is not a function.

The solution is to use fixupPluginRules from @eslint/compat (you need to install this), so my eslint.config.js has a separate object in the config array:

import { fixupPluginRules } from "@eslint/compat";

  // Even though eslint-plugin-react-hooks exposes configs.recommended, it is not yet compatible with the flat file config, 
  // because it has plugins: [ 'react-hooks' ] property, but plugins should be an object
  // Once it is supported, replace with: eslintPluginReactHooks.configs.recommended,
  {
    plugins: {
      "react": reactPlugin, // remove this if you already have another config object that adds the react plugin
      "react-hooks": fixupPluginRules(eslintPluginReactHooks),
    },
    rules: {
      ...eslintPluginReactHooks.configs.recommended.rules,
    },
  },

Resources

  • https://github.com/t3-oss/create-t3-turbo/issues/984#issuecomment-2210934687

Proof it works

I've confirmed this by having a code that should error, and saw the error:

  const [first, setfirst] = useState("");
  useEffect(() => {
    console.log(first);
  }, []);
8:6  warning  React Hook useEffect has a missing dependency: 'first'. Either include it or remove the dependency array  react-hooks/exhaustive-deps
Answer from Ben Butterworth on Stack Overflow
🌐
npm
npmjs.com › package › eslint-plugin-react-hooks
eslint-plugin-react-hooks - npm
ESLint rules for React Hooks. Latest version: 7.0.1, last published: 4 months ago. Start using eslint-plugin-react-hooks in your project by running `npm i eslint-plugin-react-hooks`. There are 10015 other projects in the npm registry using eslint-plugin-react-hooks.
      » npm install eslint-plugin-react-hooks
    
Published   Oct 24, 2025
Version   7.0.1
Homepage   https://react.dev/
🌐
React
react.dev › reference › eslint-plugin-react-hooks
eslint-plugin-react-hooks – React
This plugin helps you catch violations of React’s rules at build time, ensuring your components and hooks follow React’s rules for correctness and performance. The lints cover both fundamental React patterns (exhaustive-deps and rules-of-hooks) and issues flagged by React Compiler. React Compiler diagnostics are automatically surfaced by this ESLint plugin, and can be used even if your app hasn’t adopted the compiler yet.
Discussions

reactjs - Integration of eslint-plugin-react-hooks/recommended with eslint.config.js - Stack Overflow
I struggle a lot to configure eslint-plugin-react-hooks/recommended using eslint's new configuration file (eslint.config.js). Using the previous eslint configuration (.eslintrc.js) would have resul... More on stackoverflow.com
🌐 stackoverflow.com
Beware! If you make custom React hooks, eslint-plugin-react-hooks may not catch some issues
I don't think that this is unique to custom hooks. The same thing happens if you use an unstable array or object prop as a dependency with useEffect inside a component. Eslint doesn't know if said prob is stable or not. Perhaps the compiler makes this an non issue, not sure tho. More on reddit.com
🌐 r/reactjs
3
0
December 27, 2025
How to use eslint-plugin-react and eslint-plugin-react-hooks, just for myself?
You don't normally, because its better for the code to be consistent among developers. I would advice that you, instead aim to convince your team to install it for the project. If you still want to do it, you could install it, develop and then remove it from your package.json before commiting. And maybe create a simple script file (AI could do this for you) to do this for you. More on reddit.com
🌐 r/reactjs
7
6
January 10, 2025
eslint-plugin-react-hooks & "Flat Config" (ESLint 9)
👋 Coming over from eslint/eslint#18093: ESLint is migrating to a new "flat config" format that will be the default in ESLint v9. It doesn't look like eslint-plugin-react-hooks has doc... More on github.com
🌐 github.com
108
February 13, 2024
🌐
npm
npmjs.com › package › eslint-plugin-react-hooks-extra
eslint-plugin-react-hooks-extra - npm
1 month ago - import js from "@eslint/js"; import hooksExtra from "eslint-plugin-react-hooks-extra"; import { defineConfig } from "eslint/config"; import tseslint from "typescript-eslint"; export default defineConfig( { files: ["**/*.{ts,tsx}"], extends: [ js.configs.recommended, tseslint.configs.recommended, // Add configs from eslint-plugin-react-hooks-extra hooksExtra.configs.recommended, ], rules: { // Put rules you want to override here "react-hooks-extra/no-direct-set-state-in-use-effect": "warn", }, }, );
      » npm install eslint-plugin-react-hooks-extra
    
Published   Feb 14, 2026
Version   2.13.0
Author   Rel1cx
🌐
Snyk
security.snyk.io › snyk vulnerability database › npm
eslint-plugin-react-hooks vulnerabilities | Snyk
We found that eslint-plugin-react-hooks demonstrates a positive version release cadence with at least one new version released in the past 12 months. As a healthy sign for on-going project maintenance, we found that the GitHub repository had at least 1 pull request or issue interacted with by the community. ... The npm ...
🌐
Tessl
tessl.io › registry › tessl › npm-eslint-plugin-react-hooks › 5.2.0
5.2.0 • npm-eslint-plugin-react-hooks • tessl • Registry • Tessl
January 29, 2026 - The plugin includes core React Hooks validation rules and advanced React Compiler rules for enhanced static analysis and performance optimization. ... import reactHooks from 'eslint-plugin-react-hooks'; export default [ { files: ["src/**/*....
Top answer
1 of 4
10

When I tried the config snippet in the question by @Jonathan Kasser, I got an error: TypeError: context.getSource is not a function.

The solution is to use fixupPluginRules from @eslint/compat (you need to install this), so my eslint.config.js has a separate object in the config array:

import { fixupPluginRules } from "@eslint/compat";

  // Even though eslint-plugin-react-hooks exposes configs.recommended, it is not yet compatible with the flat file config, 
  // because it has plugins: [ 'react-hooks' ] property, but plugins should be an object
  // Once it is supported, replace with: eslintPluginReactHooks.configs.recommended,
  {
    plugins: {
      "react": reactPlugin, // remove this if you already have another config object that adds the react plugin
      "react-hooks": fixupPluginRules(eslintPluginReactHooks),
    },
    rules: {
      ...eslintPluginReactHooks.configs.recommended.rules,
    },
  },

Resources

  • https://github.com/t3-oss/create-t3-turbo/issues/984#issuecomment-2210934687

Proof it works

I've confirmed this by having a code that should error, and saw the error:

  const [first, setfirst] = useState("");
  useEffect(() => {
    console.log(first);
  }, []);
8:6  warning  React Hook useEffect has a missing dependency: 'first'. Either include it or remove the dependency array  react-hooks/exhaustive-deps
2 of 4
4

[email protected] was released a few weeks ago with "stable" eslint v9 support. If you can upgrade, then see https://github.com/facebook/react/issues/28313#issuecomment-2408157792 for a sample configuration for now.

Also, follow this thread if interested in documentation refresh

Find elsewhere
🌐
npm
npmjs.com › package › eslint-plugin-react
eslint-plugin-react - npm
April 3, 2025 - React specific linting rules for ESLint. Latest version: 7.37.5, last published: a year ago. Start using eslint-plugin-react in your project by running `npm i eslint-plugin-react`. There are 16972 other projects in the npm registry using eslint-plugin-react.
      » npm install eslint-plugin-react
    
Published   Apr 03, 2025
Version   7.37.5
Author   Yannick Croissant
🌐
React
legacy.reactjs.org › docs › hooks-rules.html
Rules of Hooks – React
That’s what allows React to correctly preserve the state of Hooks between multiple useState and useEffect calls. (If you’re curious, we’ll explain this in depth below.) Don’t call Hooks from regular JavaScript functions. Instead, you can: ... By following this rule, you ensure that all stateful logic in a component is clearly visible from its source code. We released an ESLint plugin called eslint-plugin-react-hooks that enforces these two rules.
🌐
GitHub
github.com › facebook › react › tree › main › packages › eslint-plugin-react-hooks
react/packages/eslint-plugin-react-hooks at main · facebook/react
# npm npm install eslint-plugin-react-hooks --save-dev # yarn yarn add eslint-plugin-react-hooks --dev
Author   facebook
🌐
Reddit
reddit.com › r/reactjs › how to use eslint-plugin-react and eslint-plugin-react-hooks, just for myself?
r/reactjs on Reddit: How to use eslint-plugin-react and eslint-plugin-react-hooks, just for myself?
January 10, 2025 -

Forgive me if this question is poorly worded or misinformed; I'm new to using NPM.

My team has eslint installed as a dev dependency in our project to ensure high code quality. However, we don't use the eslint-plugin-react or eslint-plugin-react-hooks packages. I'd like to install them so that I can follow the best React practices when coding, without actually making changes to the official dependencies used by all developers. Is there a way to go about this (eg, modify a personal "packages.json" that is separate from the project's but will still lint my company's project)?

🌐
Max Rozen
maxrozen.com › react-hooks-eslint-plugin-saved-hours-debugging-useeffect
How the React Hooks ESLint plugin saved me hours debugging useEffect - Max Rozen
Turns out there's an eslint rule specifically for this class of bug: react-hooks/exhaustive-deps, AND it's part of a package maintained by the React team. That's where eslint-plugin-react-hooks comes in.
🌐
GitHub
github.com › reactwg › react-compiler › discussions › 18
Using `eslint-plugin-react-hooks` together with `eslint-plugin-react-compiler` · reactwg/react-compiler · Discussion #18
Just a heads-up, the official docs recommend using the eslint-plugin-react-hooks@rc (without the eslint-plugin-react-compiler, I guess) version for better integration with the React Compiler's recommended settings.
Author   reactwg
🌐
React
react.dev › reference › eslint-plugin-react-hooks › lints › exhaustive-deps
exhaustive-deps – React
You can configure custom effect hooks using shared ESLint settings (available in eslint-plugin-react-hooks 6.1.1 and later):
🌐
Socket
socket.dev › npm › package › eslint-plugin-react-hooks
eslint-plugin-react-hooks - npm Package Security Analysis - ...
October 24, 2025 - ESLint rules for React Hooks. Version: 7.0.1 was published by react-bot. Start using Socket to analyze eslint-plugin-react-hooks and its dependencies ...
🌐
React
react.dev › reference › eslint-plugin-react-hooks › lints › rules-of-hooks
rules-of-hooks – React
You can configure custom effect hooks using shared ESLint settings (available in eslint-plugin-react-hooks 6.1.1 and later):
🌐
GitHub
github.com › facebook › react › issues › 28313
eslint-plugin-react-hooks & "Flat Config" (ESLint 9) · Issue #28313 · facebook/react
February 13, 2024 - // eslint.config.js import eslint from "@eslint/js"; import hooksPlugin from "eslint-plugin-react-hooks"; export default [ eslint.configs.recommended, { plugins: { "react-hooks": hooksPlugin, }, rules: hooksPlugin.configs.recommended.rules, }, ]; Most community plugins provide a more convenient wrapper. For example, eslint-plugin-jsdoc provides a jsdoc.configs['flat/recommended'] object: // eslint.config.js import jsdoc from 'eslint-plugin-jsdoc'; export default [ jsdoc.configs['flat/recommended'], ]; Would the React team be open to a PR adding in a preset object like that? And either way, updating the docs on https://www.npmjs.com/package/eslint-plugin-react-hooks?
Author   JoshuaKGoldberg
🌐
Medium
leandroaps.medium.com › best-eslintrc-configuration-for-cra-for-now-81753cf39c19
Linting your code with Prettier + ESLint for React Hooks with VSCode | by Leandro A. Siqueira | Medium
October 19, 2021 - "husky": { "hooks": { "pre-commit": "lint-staged" } }, Run linters against staged git files and don’t let 💩 slip into your code base! "lint-staged": { "src/**/*.{js,jsx,json}": [ "npm run format", "npm run lint:fix" ] } }, Create a .eslintrc file, you can use: touch .eslintrc · Add the source to this file: { "env": { "browser": true, "es6": true, "jest": true, "node": true }, "extends": [ "airbnb", "plugin:jsx-a11y/strict", "plugin:react/recommended", "plugin:prettier/recommended", "prettier/react", "plugin:compat/recommended", "plugin:cypress/recommended" ], "parser": "babel-eslint", "p