Skip to content

[Compiler Bug]: eslint-plugin-react-hooks breaks the VS Code ESLint extension #35897

@simarmol

Description

@simarmol

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-hooks (build issue installing or using the eslint plugin)
  • react-compiler-healthcheck (build issue installing or using the healthcheck script)

Link to repro

https://github.com/simarmol/eslint-plugin-react-hooks-repro

Repro steps

The latest version of eslint-plugin-react-hooks does not show a code/identity for any errors in the VS Code Problem Pane, only the codes. This can be seen by having an error in a file for eslint-plugin-react-hooks, having the ESLint extension installed and opening a file with issues, then viewing the problem pane,

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.

  • Open the repo with VS Code
  • Install the ESLint extension
  • run yarn or package manager of choice to install dependencies
  • Open index.jsx
  • Open problem view in VS Code (In the Command Palette :Focus on Problems View)
  • See 1 ESlint error in the pane - with the Code field missing
  • Run npx eslint
  • See ✖ 36 problems (31 errors, 5 warnings)

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:

  • Comment out line 10 in the repro's eslint.config.mjs
  • Open the problem pane
  • See the React/* plugin rule violations working properly

I'm unsure if this is an issue with the formatting of the rule output on your end or a bug with the ESLint extension.

How often does this bug happen?

Every time

What version of React are you using?

19.0.0

What version of React Compiler are you using?

1.0.0

Metadata

Metadata

Assignees

No one assigned

    Labels

    Status: UnconfirmedA potential issue that we haven't yet confirmed as a bugType: Bug

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions