VSCode + TypeScript + ESLint + Prettier + React

.eslintrc.js

/** @type import("eslint").Linter.Config */
module.exports = {
  env: { browser: true, node: true },
  parser: '@typescript-eslint/parser',
  extends: [
    "eslint:recommended",
    "plugin:@typescript-eslint/recommended",
    "plugin:import/errors",
    "plugin:import/warnings",
    "plugin:react/recommended",
    "plugin:react-hooks/recommended",
    "prettier",
  ],
  rules: {
    "@typescript-eslint/no-unused-vars": ["error", { argsIgnorePattern: "^_" }],
    "react/prefer-stateless-function": "error",
    "import/order": ["error", { alphabetize: { order: "asc" } }],

    // https://github.com/basarat/typescript-book/blob/master/docs/tips/defaultIsBad.md
    // https://twitter.com/dan_abramov/status/1255229440860262400
    "import/no-default-export": "error",

  },
  settings: { react: { version: "detect" } }
};

settings.json

// .vscode/settings.json

{
  "editor.codeActionsOnSave": ["source.fixAll"],
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.formatOnSave": true
}

yarn-add.sh

yarn add -D \
  @typescript-eslint/eslint-plugin \
  @typescript-eslint/parser \
  prettier \
  eslint \
  eslint-config-prettier \
  eslint-plugin-react \
  eslint-plugin-react-hooks \
  eslint-plugin-import

Next.js example https://github.com/vercel/next.js/blob/canary/examples/with-typescript-eslint-jest/.eslintrc.json