My favorite ESLint configuration

.eslintrc.js

/* eslint-disable unicorn/prefer-module */
module.exports = {
  root: true,
  parser: "@typescript-eslint/parser",
  plugins: [
    "@typescript-eslint",
    "unicorn",
    "import",
    "react",
    "prettier",
    "react-hooks",
    "jsx-a11y",
    "promise",
  ],
  extends: [
    "plugin:unicorn/recommended",
    "plugin:react-hooks/recommended",
    "plugin:react/recommended",
    "plugin:@typescript-eslint/recommended",
    "plugin:prettier/recommended",
    "plugin:import/errors",
    "plugin:import/warnings",
    "plugin:import/typescript",
    "plugin:jsx-a11y/recommended",
    "plugin:promise/recommended",
  ],
  env: {
    browser: true,
    es2021: true,
  },
  settings: {
    react: {
      version: "detect",
    },
    "import/resolver": {
      node: {
        extensions: [".ts", ".tsx"],
      },
    },
  },
  rules: {
    "react/button-has-type": "error",
    "react/function-component-definition": [
      "error",
      {
        namedComponents: "function-declaration",
        unnamedComponents: "arrow-function",
      },
    ],
    "prefer-const": "off",
    "@typescript-eslint/explicit-module-boundary-types": "off",
    "@typescript-eslint/no-non-null-assertion": "off",
    "react/react-in-jsx-scope": "off",
    "react/jsx-uses-react": "off",
    "no-unused-vars": "off",
    "no-var": "off",
    "unicorn/no-null": "off",
    "unicorn/prefer-node-protocol": "off",
    "unicorn/filename-case": "off",
    "unicorn/prevent-abbreviations": "off",
  },
  parserOptions: {
    ecmaFeatures: {
      jsx: true,
    },
    ecmaVersion: 12,
    sourceType: "module",
  },
};

cypress.eslintrc.js

// I add this inside the cypress folder to add this extra rules to the ESLint config for Cypress
/* eslint-disable unicorn/prefer-module */
module.exports = {
  plugins: ["cypress"],
  extends: ["plugin:cypress/recommended"],
  env: {
    "cypress/globals": true,
  },
};

jest.eslintrc.js

// I add this inside the test (for Jest) folder to add this extra rules to the ESLint config for Jest
/* eslint-disable unicorn/prefer-module */
module.exports = {
  plugins: ["jest", "testing-library", "jest-dom"],
  extends: [
    "plugin:jest/recommended",
    "plugin:testing-library/react",
    "plugin:jest-dom/recommended",
  ],
};