react-hooks-js/incompatible-library
Validates against usage of libraries which are incompatible with memoization (manual or automatic)
- Category: React Compiler
- Severity: error
- Source:
eslint-plugin-react-hooks - Framework: global
- Enabled when: eslint-plugin-react-hooks v6+ installed AND React Compiler detected in project
- Documentation: https://react.dev/reference/eslint-plugin-react-hooks/lints/incompatible-library
Validation prompt
Use this to decide whether a fired diagnostic is real or a false positive.
Fires on a hardcoded allowlist (maintained in facebook/react's DefaultModuleTypeProvider.ts) of APIs that use interior mutability and break memoization — currently react-hook-form's watch(), TanStack Table's useReactTable, and others. False positive: you've already opted that file or component out of compilation via the 'use no memo' directive, or the API has shipped a memo-safe replacement since the list was published.
Fix prompt
Use this once validation confirms the diagnostic is real.
Swap for the library's memo-safe alternative when one exists — useWatch + control instead of watch for react-hook-form, the newer immutable-state hooks for TanStack Table. For libraries without a fix (MobX observer, etc.), add 'use no memo' as the first statement of the affected component or file so the Compiler skips it cleanly. File an issue upstream so the allowlist can grow. See https://react.dev/reference/eslint-plugin-react-hooks/lints/incompatible-library
Related rules
More React Compiler rules from the rules reference:
react-hooks-js/preserve-manual-memoization: Validates that existing manual memoized is preserved by the compiler. React Compiler will only compile components and hooks if its inference [matches or exceeds the existing manual memoization](https://react.dev/learn/react-compiler/introduction#what-should-i-do-about-usememo-usecallback-and-reactmemo)react-hooks-js/purity: Validates that [components/hooks are pure](https://react.dev/reference/rules/components-and-hooks-must-be-pure) by checking that they do not call known-impure functionsreact-hooks-js/refs: Validates correct usage of refs, not reading/writing during render. See the "pitfalls" section in [`useRef()` usage](https://react.dev/reference/react/useRef#usage)react-hooks-js/set-state-in-effect: Validates against calling setState synchronously in an effect. This can indicate non-local derived data, a derived event pattern, or improper external data synchronization.react-hooks-js/set-state-in-render: Validates against setting state during render, which can trigger additional renders and potential infinite render loops