Bug: eprh README eslint.config.js examples cause parsing errors

[mdj-uk]

The sample eslint.config.js in the eprh readme doesn't work out of the box. It errors with

Parsing error: Unexpected token ...

either due to not recognising jsx syntax (in a js project) or not recognising typescript syntax (ts project)

I realise that providing a fully functional eslint setup is outside the scope of react, and much will depend on framework/bundler. But I think having an absolutely minimal example which works if you copy-paste would be helpful, both for people not yet using eslint who want to start using the linter, and also for folks having problems updating to the latest version.

eslint-plugin-react-hooks version: 6.1.1
update: version 7.0.0 also has a problem, see comment below

Steps To Reproduce

1. clone repros / open sandboxes
2. try running npm run lint

Link to code example:

• js: https://github.com/mdj-uk/vite-react-no-ts (sandbox)
• ts: https://github.com/mdj-uk/vite-react-ts (sandbox)

The current behavior

Parsing error when trying to lint

The expected behavior

Linting should work if you copy-paste example configs from readme

[mdj-uk]

Update after release of eprh 7.0.0:

If you use the latest readme examples you no longer get a parsing error, but the linter does nothing.

It looks like the same fix needed as before: for a js project you need to set languageOptions.parserOptions.ecmaFeatures.jsx to true (and have a files entry); for typescript, you need to add typescript-eslint.

Minimal working setup for js:

// eslint.config.js
import reactHooks from "eslint-plugin-react-hooks";
import { defineConfig } from "eslint/config";

export default defineConfig([
  {
    ...reactHooks.configs.flat["recommended-latest"],
    files: ["src/**/*.{js,jsx}"],
    languageOptions: {
      parserOptions: {
        ecmaFeatures: { jsx: true },
      },
    },
  },
]);

Minimal working setup for ts:

// eslint.config.js
import reactHooks from "eslint-plugin-react-hooks";
import { defineConfig } from "eslint/config";
import tseslint from "typescript-eslint";

export default defineConfig([
  tseslint.configs.recommended,
  reactHooks.configs.flat["recommended-latest"],
]);

Disclaimer: I am not an expert in eslint config or module resolution or anything like that - ideally smarter people than me would verify that it works in different scenarios :-)

But since the eslint plugin is such an important part of react I think it would be incredibly useful to have clear setup instructions which just work out of the box - including for people not already using eslint.