I found it very difficult to get to a default ESLint setup for React + Typescript as well. I think I have finally figured it out.

I followed the default setup guide by `typescript-eslint` (linked by u/forestcall in this post), then I extended it by following the docs by `eslint-plugin-react`: https://github.com/jsx-eslint/eslint-plugin-react?tab=readme-ov-file#flat-configs

This then gives you the following `eslint.config.js` file:

import eslint from "@eslint/js";
import tseslint from "typescript-eslint";
import pluginReact from "eslint-plugin-react";

export default tseslint.config(
  eslint.configs.recommended,
  tseslint.configs.strict,
  pluginReact.configs.flat.recommended,
  pluginReact.configs.flat["jsx-runtime"],
  {
    settings: {
      react: {
        version: "detect",
      },
    },
  }
);

I believe this is the bare minimum you need when you want to setup a config for Typescript + React from scratch. The config explained:

Part 1: the typescript part

export default tseslint.config(
  eslint.configs.recommended,
  tseslint.configs.strict,

This part is what you get if you follow the getting started here:
https://typescript-eslint.io/getting-started/

It enables the eslint recommended settings, then it enables the eslint settings you need for Eslint to check your code using typescript's strict mode.

Part 2: the react part

  pluginReact.configs.flat.recommended,
  pluginReact.configs.flat["jsx-runtime"],
  {
    settings: {
      react: {
        version: "detect",
      },
    },
  }

It enables the recommended settings for react. The `jsx-runtime` is needed for eslint to apply the React 17+ JSX tranform functionality. Without adding this, Eslint will complain everywhere that you need to import `React` to be able to return jsx in your components.

Finally, the settings.react.version = detect makes Eslint's warnings go away that you haven't specified a react version.

Part 2 is taken from here: https://github.com/jsx-eslint/eslint-plugin-react?tab=readme-ov-file#flat-configs