GitHub
github.com › reactwg › react-compiler › discussions › 25
How do I use eslint-plugin-react-compiler with eslint 9? · reactwg/react-compiler · Discussion #25
import reactCompilerPlugin from 'eslint-plugin-react-compiler'; export default [ { plugins: { "react-compiler": reactCompilerPlugin }, rules: { "react-compiler/react-compiler": "error", }, files: ["**/*.res.mjs"] }];
Author reactwg
GitHub
github.com › jsx-eslint › eslint-plugin-react
GitHub - jsx-eslint/eslint-plugin-react: React-specific linting rules for ESLint · GitHub
React-specific linting rules for ESLint. Contribute to jsx-eslint/eslint-plugin-react development by creating an account on GitHub.
Starred by 9.3K users
Forked by 2.7K users
Languages JavaScript
[internal] Adopt eslint-plugin-react-compiler
Context The React Compiler optimizes code that follows the rules of React. In order to make it easier to write React compliant code, the React team released an ESLint plugin that reports broken Rea... More on github.com
[core] Fix eslint-plugin-react-compiler issues
Part of #42548 As part of adopting the official ESLint plugin for the React Compiler, we want to solve all of the reported issues. Contributing Pick a file (or group of files belonging to the same ... More on github.com
Bug: Error using eslint-plugin-react-compiler in a TypeScript config (`eslint.config.ts`)
Environment Node version: v23.1.0 npm version: v10.9.0 Local ESLint version: v9.20.0 (Currently used) Global ESLint version: Not found Operating System: darwin 24.2.0 What parser are you using? Def... More on github.com
[Compiler Bug]: eslint-plugin-react-compiler has incorrect type definitions
What kind of issue is this? React Compiler core (the JS output is incorrect, or your app works incorrectly after optimization) babel-plugin-react-compiler (build issue installing or using the Babel plugin) eslint-plugin-react-compiler (b... More on github.com
Videos
ESLint Configuration • React JS Programming • React ...
05:27
React Compiler / React Forget - with Vite - YouTube
09:33
22. Install ESLint in the React Project and configure React Plugin ...
09:59
React Setup - 05 - ESLint & Prettier - YouTube
00:18
React version not specified in eslint plugin react - YouTube
21:36
Adding ESLint to your React.js project - YouTube
GitHub
github.com › reactwg › react-compiler › discussions › 17
Eslint Plugin Performance · reactwg/react-compiler · Discussion #17
July 8, 2024 - We're currently working on migrating each of those react roots off of the deprecated ReactDOM APIs that were removed in v19 (as an aside, this issue is slowing us down a bit facebook/react#29235). So we haven't been able to start testing the compiler itself out yet. In the meantime, I wanted to connect the compiler eslint plugin, so that we can flush out any other issues that might be flying under our radar, and I encountered some concerning performance issues when adding the eslint-plugin-react-compiler to our linting setup.
Author reactwg
npm
npmjs.com › package › eslint-plugin-react-compiler
eslint-plugin-react-compiler - npm
ESLint plugin to display errors found by the React compiler.. Latest version: 19.1.0-rc.2, last published: 10 months ago. Start using eslint-plugin-react-compiler in your project by running `npm i eslint-plugin-react-compiler`. There are 107 ...
» npm install eslint-plugin-react-compiler
GitHub
github.com › reactwg › react-compiler › discussions › 18
Using `eslint-plugin-react-hooks` together with `eslint-plugin-react-compiler` · reactwg/react-compiler · Discussion #18
React Hook useEffect has a missing dependency: 'form'. Either include it or remove the dependency array. eslint(react-hooks/exhaustive-deps) I think the issue is that the rule is doing 2 different things. I hope the react-compiler linter will be able to show only the second error message.
Author reactwg
GitHub
github.com › facebook › react › tree › main › compiler › packages › eslint-plugin-react-compiler
react/compiler/packages/eslint-plugin-react-compiler at main · facebook/react
+ import reactCompiler from "eslint-plugin-react-compiler" import react from "eslint-plugin-react" export default [ // Your existing config { ...pluginReact.configs.flat.recommended, settings: { react: { version: "detect" } } }, + reactCompiler.configs.recommended ]
Author facebook
GitHub
github.com › mui › material-ui › issues › 42548
[internal] Adopt eslint-plugin-react-compiler · Issue #42548 · mui/material-ui
June 6, 2024 - Context The React Compiler optimizes code that follows the rules of React. In order to make it easier to write React compliant code, the React team released an ESLint plugin that reports broken React rules: eslint-plugin-react-compiler. ...
Author aarongarciah
GitHub
github.com › mui › material-ui › issues › 42564
[core] Fix eslint-plugin-react-compiler issues · Issue #42564 · mui/material-ui
June 7, 2024 - Enable eslint-plugin-react-compiler in your local setup. The plugin is disabled by default, you won't see issues reported by it unless you enable it manually. To enable it, go to the root .eslintrc.js file and set ENABLE_REACT_COMPILER_PLUGIN to true.
Author aarongarciah
GitHub
github.com › eslint › eslint › issues › 19413
Bug: Error using eslint-plugin-react-compiler in a TypeScript config (`eslint.config.ts`) · Issue #19413 · eslint/eslint
December 24, 2024 - That Babel plugin rewrites all references to default imports. So when I do import reactCompiler from 'eslint-plugin-react-compiler', every reference to reactCompiler in the config becomes reactCompiler.default.
Author brandongit2
GitHub
github.com › facebook › react › issues › 32575
[Compiler Bug]: eslint-plugin-react-compiler has incorrect type definitions · Issue #32575 · facebook/react
March 12, 2025 - Component: React CompilerStatus: UnconfirmedA potential issue that we haven't yet confirmed as a bugA potential issue that we haven't yet confirmed as a bugType: Bug ... eslint.config.js:11:3 - error TS2345: Argument of type '{ plugins: { 'react-compiler': { rules: { 'react-compiler': RuleModule; }; }; }; rules: { 'react-compiler/react-compiler': string; }; }' is not assignable to parameter of type 'InfiniteDepthConfigWithExtends'.
Author printfn
GitHub
github.com › biomejs › biome › discussions › 2999
How to get eslint-plugin-react-compiler with biome? · biomejs/biome · Discussion #2999
With Eslint and React 19 + React Compiler there is eslint eslint-plugin-react-compiler how can i use this with biome?
Author biomejs
GitHub
github.com › Rel1cx › eslint-react
GitHub - Rel1cx/eslint-react: 4-7x faster, composable ESLint rules for React and friends.
Starred by 490 users
Forked by 39 users
Languages TypeScript 80.1% | MDX 19.3% | TypeScript 80.1% | MDX 19.3%
Collected
collected.press › github › facebook › react@3a0ab8a7eea22394ba8948ff02af1c6d6e6e1921 › compiler › packages › eslint-plugin-react-compiler › README.md
eslint-plugin-react-compiler
+ import reactCompiler from "eslint-plugin-react-compiler" import react from "eslint-plugin-react" export default [ // Your existing config { ...pluginReact.configs.flat.recommended, settings: { react: { version: "detect" } } }, + reactCompiler.configs.recommended ]
GitHub
github.com › facebook › react › issues › 35897
[Compiler Bug]: eslint-plugin-react-hooks breaks the VS Code ESLint extension · Issue #35897 · facebook/react
3 weeks ago - In the repro repo I have linked I have copied the examples of the violations from the react docs into one file and set up a basic eslint config. ... The issue I originally wanted to report was the missing 'Code' field for most of the hooks rules in the VS Code pane, but when I made the repro I found it barely seems to work at all with the hooks ruleset, and indeed they seem to break linting functionality for other rules in the same file in VS Code's ESLint extension. To show that it is the hooks plugin causing the issue:
Author simarmol
GitHub
github.com › reactwg › react-compiler › discussions › 40
Recommended config for 'eslint-plugin-react-compiler' ? · reactwg/react-compiler · Discussion #40
I'm using React Compiler (react-compiler-runtime@beta) with eslint plugin (eslint-plugin-react-compiler@beta) on a project running React 18. This what I added to .eslinrc according officical docs: ...
Author reactwg
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