@dr.pogodin/eslint-configs
Version:
ESLint configurations for TypeScript and/or React projects
167 lines (128 loc) • 6.59 kB
Markdown
# ESLint Configs
[](https://www.npmjs.com/package/@dr.pogodin/eslint-configs)
[](https://www.npmjs.com/package/@dr.pogodin/eslint-configs)
[](https://app.circleci.com/pipelines/github/birdofpreyru/eslint-configs)
[](https://github.com/birdofpreyru/eslint-configs)
[](https://dr.pogodin.studio/docs/eslint-configs)
[ESLint] configurations for JavaScript, TypeScript and/or React projects.
This project is invisioned as a replacement for AirBnB ESLint configurations
([eslint-config-airbnb]), which are no longer maintained by AirBnB. Our aims are:
- Code style and rules similar to that of the original AirBnB configs +
Some opinionated improvements on top them.
- Timely support of the latest ESLint and plugin releases.
[](https://github.com/sponsors/birdofpreyru)
## Content
- [Getting Started]
- [Provided Configs]
- [`configs.javascript`]
- [`configs.jest`]
- [`configs.react`]
- [`configs.typescript`]
## Getting Started
[Getting Started]: #getting-started
- Install this package and ESLint as developement dependencies:
```sh
npm install --save-dev @dr.pogodin/eslint-configs
```
- Some plugins & rules we use depend on [Babel]. If you don't have it explicitly
installed and configured in your project you should set `requireConfigFile`
option of parser to `false`, _e.g._:
```js
// eslint.config.mjs
import { defineConfig } from 'eslint/config';
import eslintConfigs from '@dr.pogodin/eslint-configs';
export default defineConfig([
{
languageOptions: {
parserOptions: {
requireConfigFile: false,
},
},
},
eslintConfigs.config.javascript,
]);
```
- Add necessary configurations into your flat ESLint config file, for example
(also see [Provided Configs] section below for further details):
```js
// eslint.config.mjs
/* eslint-disable import/no-extraneous-dependencies */
// defineConfig() is an optional helper provided by ESLint
import { defineConfig } from 'eslint/config';
import eslintConfigs from '@dr.pogodin/react-utils';
export default defineConfig([
{
// Global ignore rules: an array of path patterns to be ignored by ESLint
// for all other objects included into this configuration, in addition to
// "**/node_modules/" and ".git/" paths which are always ignored; see:
// https://eslint.org/docs/latest/use/configure/configuration-files#globally-ignoring-files-with-ignores
ignores: ['build/'],
},
// Apply JavaScript, TypeScript, and React configs to all files matched by
// those configs by default.
eslintConfigs.configs.javascript,
eslintConfigs.configs.typescript,
eslintConfigs.configs.react,
{
// Additionally apply Jest config to the folder with Jest-based unit
// tests.
extends: [eslintConfigs.configs.jest],
files: ['__tests__/**'],
},
]);
```
## Provided Configs
[Provided Configs]: #provided-configs
This package provides the following base configurations, that are meant to be
combined and extended as necessary for the needs of host projects.
### `configs.javascript`
[`configs.javascript`]: #configsjavascript
Intended for JavaScript code, it applies to the files [ESLint] considers as
JavaScript by default: `**/*.js`, `**/*.cjs`, `**/*.mjs`; and it applies to
them the following rule sets:
- [ESLint Core Rules](https://eslint.org/docs/latest/rules) —
the `recommended` rule set, with minor overrides, and many additional rules
enabled.
- [@babel/eslint-plugin](https://www.npmjs.com/package/@babel/eslint-plugin) —
all rules enabled, with minor overrides of their default settings.
- [@stylistic/eslint-plugin](https://eslint.style/rules) —
the `recommended` rule set, with minor overrides, and many additional rules
enabled.
- [eslint-plugin-import](https://www.npmjs.com/package/eslint-plugin-import) —
the `recommended` rule set, with minor overrides, and many additional rules
enabled.
### `configs.jest`
[`configs.jest`]: #configsjest
Intended for [Jest](https://jestjs.io)-based unit test code, it applies to all
files (assuming the consumer himself will configure the correct paths to apply
it to); and it applies to them the following rule sets:
- [eslint-plugin-jest](https://www.npmjs.com/package/eslint-plugin-jest) —
the `recommended` and `style` rule sets, with a bunch of additional rules
enabled.
### `configs.react`
[`configs.react`]: #configsreact
Intended for React code, it applies to `**/*.jsx` and `**/*.tsx` files;
and it applies to them the following rule sets:
- [eslint-plugin-jsx-a11y](https://www.npmjs.com/package/eslint-plugin-jsx-a11y) —
the `recommended` rule set, and a few additional rules enabled.
- [eslint-plugin-react](https://www.npmjs.com/package/eslint-plugin-react) —
the `recommended` rule set, with minor overrides, and many additional rules
enabled.
Additionally, it applies to all other files matched by any other [ESLint]
configuration object; and it applies to them the following rule sets:
- [eslint-plugin-react-hooks](https://www.npmjs.com/package/eslint-plugin-react-hooks)
— all rules enabled (it has to apply to all files, as hooks do not have
to live ony inside JSX or TSX files exclusively).
- the rule that forbids using JSX syntax in files with extensions different from
`.jsx` or `.tsx`.
### `configs.typescript`
[`configs.typescript`]: #configstypescript
Intended for TypeScript code, it applies to `**/*.ts` and `**/*.tsx` files;
and it applies to them the following rule sets:
- Everything from our [`configs.javascript`], with minor necessary overrides.
- [typescript-eslint](https://typescript-eslint.io/rules) —
the `recommendedTypeChecked` and `stylisticTypeChecked` rule sets, with minor
overrides, and many additional rules enabled.
[Babel]: https://babeljs.io
[ESLint]: https://eslint.org
[eslint-config-airbnb]: https://www.npmjs.com/package/eslint-config-airbnb