My ESLint configurations

.eslintrc

{
	"root": true,
	"extends": [ "react-app", "plugin:jsx-a11y/recommended" ],
	"plugins": [ "jsx-a11y" ],
	"parser": "babel-eslint",
	"parserOptions": {
		"ecmaVersion": 8,
		"ecmaFeatures": {
			"experimentalObjectRestSpread": true,
			"impliedStrict": true,
			"classes": true
		}
	},
	"env": {
		"browser": true,
		"node": true,
		"jquery": true,
		"jest": true
	},
	"rules": {
		"no-debugger": 0,
		"no-unused-vars": [
			1,
			{
				"argsIgnorePattern": "res|next|^err"
			}
		],
		"no-unused-expressions": [
			2,
			{
				"allowTaggedTemplates": true
			}
		],
		"no-param-reassign": [
			2,
			{
				"props": false
			}
		],
		"camelcase": 0,
		"no-console": 0,
		"import/prefer-default-export": 0,
		"import": 0,
		"func-names": 0,
		"space-before-function-paren": 0,
		"block-spacing": [ 2, "always" ],
		"space-in-parens": [ 2, "always" ],
		"object-curly-spacing": [ 2, "always" ],
		"template-curly-spacing": [ 2, "always" ],
		"array-bracket-spacing": [ 2, "always" ],
		"comma-dangle": 0,
		"max-len": 0,
		"import/extensions": 0,
		"no-underscore-dangle": 0,
		"consistent-return": 0,
		"react/display-name": 0,
		"react/react-in-jsx-scope": 0,
		"react/prefer-stateless-function": 0,
		"react/forbid-prop-types": 0,
		"react/no-unescaped-entities": 0,
		"react/jsx-curly-spacing": [ 2, "always" ],
		"react/jsx-filename-extension": [
			1,
			{
				"extensions": [ ".js", ".jsx" ]
			}
		],
		"radix": 0,
		"quotes": [
			2,
			"single",
			{
				"avoidEscape": true,
				"allowTemplateLiterals": true
			}
		],
		"jsx-a11y/accessible-emoji": 0,
		"jsx-a11y/href-no-hash": "off",
		"jsx-a11y/anchor-is-valid": [
			"warn",
			{
				"aspects": [ "invalidHref" ]
			}
		]
	}
}

.eslintrc-airbnb

{
	"extends": "airbnb",
	"parser": "babel-eslint",
	"parserOptions": {
		"ecmaVersion": 8,
		"ecmaFeatures": {
			"experimentalObjectRestSpread": true,
			"impliedStrict": true,
			"classes": true
		}
	},
	"env": {
		"browser": true,
		"node": true,
		"jquery": true,
		"jest": true
	},
	"rules": {
		"no-debugger": 0,
		"no-unused-vars": [
			1,
			{
				"argsIgnorePattern": "res|next|^err"
			}
		],
		"arrow-body-style": [
			2,
			"as-needed"
		],
		"no-unused-expressions": [
			2,
			{
				"allowTaggedTemplates": true
			}
		],
		"no-param-reassign": [
			2,
			{
				"props": false
			}
		],
		"camelcase": 0,
		"no-console": 0,
		"import/prefer-default-export": 0,
		"import": 0,
		"func-names": 0,
		"space-before-function-paren": 0,
		"block-spacing": [2, "always"],
		"space-in-parens": [2, "always"],
		"object-curly-spacing": [2, "always"],
		"template-curly-spacing": [2, "always"],
		"array-bracket-spacing": [2, "always"],
		"comma-dangle": 0,
		"max-len": 0,
		"import/extensions": 0,
		"no-underscore-dangle": 0,
		"consistent-return": 0,
		"react/display-name": 0,
		"react/react-in-jsx-scope": 0,
		"react/prefer-stateless-function": 0,
		"react/forbid-prop-types": 0,
		"react/no-unescaped-entities": 0,
		"react/jsx-curly-spacing": [2, "always"],
		"react/jsx-filename-extension": [
			1,
			{
				"extensions": [
					".js",
					".jsx"
				]
			}
		],
		"radix": 0,
		"no-shadow": [
			2,
			{
				"hoist": "all",
				"allow": [
					"resolve",
					"reject",
					"done",
					"next",
					"err",
					"error"
				]
			}
		],
		"quotes": [
			2,
			"single",
			{
				"avoidEscape": true,
				"allowTemplateLiterals": true
			}
		],
		"jsx-a11y/accessible-emoji": 0,
		"jsx-a11y/href-no-hash": "off",
		"jsx-a11y/anchor-is-valid": [
			"warn",
			{
				"aspects": [
					"invalidHref"
				]
			}
		]
	},
}

.eslintrc-base.json

{
	"extends": [
		"eslint:recommended",
		"plugin:import/errors",
		"plugin:react/recommended",
		"plugin:jsx-a11y/recommended",
		"prettier",
		"prettier/react"
	],
	"rules": {
		"react/prop-types": 0,
		"no-console": 1,
		"react-hooks/rules-of-hooks": 2,
		"react-hooks/exhaustive-deps": 1
	},
	"plugins": ["react", "import", "jsx-a11y", "react-hooks"],
	"parserOptions": {
		"ecmaVersion": 2018,
		"sourceType": "module",
		"ecmaFeatures": {
			"jsx": true
		}
	},
	"env": {
		"es6": true,
		"browser": true,
		"node": true
	},
	"settings": {
		"react": {
			"version": "detect"
		}
	}
}

The currnet .eslintrc file is for projects using Create React App. You may not need to install the additional dependencies, CRA should have them included by default. If not, you can view the docs for the eslint-config-react-app module as a reference - which also provides setup instructions for projects not using CRA or those that have been "ejected".

Worth exploring and extending Automattic's wpcalypso configurations as well. There's also the wpcalypso/react for React projects included in that repo - see README. From there, I may only need to make minor adjustments. See the Calypso's .eslintrc file as an example of a project that extends these configs and adds a small handful of overrides.

The .eslintrc-base.jsonfile is a simple and flexible configuration for most React projects.

Referenced from the Frontend Masters course Complete Intro to React, v5 by Brian Holt.

Requires the following installations:

• "babel-eslint"
• "eslint"
• "eslint-config-prettier"
• "eslint-plugin-import"
• "eslint-plugin-jsx-a11y"
• "eslint-plugin-react"
• "eslint-plugin-react-hooks"

Run npm i -D babel-eslint eslint eslint-config-prettier eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react eslint-plugin-react-hooks