---
id: configs
title: Shared Configs
---

import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';

[ESLint shareable configurations](https://eslint.org/docs/latest/developer-guide/shareable-configs) exist to provide a comprehensive list of rules settings that you can start with.
`@typescript-eslint/eslint-plugin` includes built-in configurations you can extend from to pull in the recommended starting rules.

> With the exception of `all`, `strict`, and `strict-type-checked`, all configurations are considered "stable".
> Rule additions and removals are treated as breaking changes and will only be done in major version bumps.

## Getting Started

See [Getting Started > Quickstart](../getting-started/Quickstart.mdx) first to set up your ESLint configuration file.
[Packages > typescript-eslint](../packages/TypeScript_ESLint.mdx) includes more documentation on the `tseslint` helper.

```js title="eslint.config.mjs"
// @ts-check

import js from '@eslint/js';
import { defineConfig } from 'eslint/config';
import tseslint from 'typescript-eslint';

export default defineConfig(
  js.configs.recommended,
  tseslint.configs.recommended,
);
```

### Projects Without Type Checking

If your project does not enable [typed linting](../getting-started/Typed_Linting.mdx), we suggest enabling the [`recommended`](#recommended) and [`stylistic`](#stylistic) configurations to start:

<Tabs groupId="eslint-config">
<TabItem value="Flat Config">

```js title="eslint.config.mjs"
export default defineConfig(
  js.configs.recommended,
  tseslint.configs.recommended,
  tseslint.configs.stylistic,
);
```

</TabItem>
<TabItem value="Legacy Config">

```js title=".eslintrc.js"
module.exports = {
  extends: [
    'eslint:recommended',
    'plugin:@typescript-eslint/recommended',
    'plugin:@typescript-eslint/stylistic',
  ],
};
```

</TabItem>
</Tabs>

> If a majority of developers working on your project are comfortable with TypeScript and typescript-eslint, consider replacing `recommended` with `strict`.

### Projects With Type Checking

If your project enables [typed linting](../getting-started/Typed_Linting.mdx), we suggest enabling the [`recommended-type-checked`](#recommended-type-checked) and [`stylistic-type-checked`](#stylistic-type-checked) configurations to start:

:::note
To use type-checking, you also need to configure `languageOptions.parserOptions` as shown in [typed linting docs](../getting-started/Typed_Linting.mdx).
:::

<Tabs groupId="eslint-config">
<TabItem value="Flat Config">

```js title="eslint.config.mjs"
export default defineConfig(
  js.configs.recommended,
  // Added lines start
  tseslint.configs.recommendedTypeChecked,
  tseslint.configs.stylisticTypeChecked,
  // Added lines end
  // Other configuration...
);
```

</TabItem>
<TabItem value="Legacy Config">

```js title=".eslintrc.js"
module.exports = {
  extends: [
    'eslint:recommended',
    // Added lines start
    'plugin:@typescript-eslint/recommended-type-checked',
    'plugin:@typescript-eslint/stylistic-type-checked',
    // Added lines end
  ],
  // Other configuration...
};
```

</TabItem>
</Tabs>

> If a majority of developers working on your project are comfortable with TypeScript and typescript-eslint, consider replacing `recommended-type-checked` with `strict-type-checked`.

## Recommended Configurations

We recommend that most projects should extend from one of:

- [`recommended`](#recommended): Recommended rules for code correctness that you can drop in without additional configuration.
- [`recommended-type-checked`](#recommended-type-checked): Contains `recommended` + additional recommended rules that require type information.
- [`strict`](#strict): Contains `recommended` + additional strict rules that can also catch bugs but are more opinionated than recommended rules.
- [`strict-type-checked`](#strict-type-checked): Contains `strict` + additional strict rules require type information.

Additionally, we provide a [`stylistic`](#stylistic) config that enforces concise and consistent code.
We recommend that most projects should extend from either:

- [`stylistic`](#stylistic): Stylistic rules you can drop in without additional configuration.
- [`stylistic-type-checked`](#stylistic-type-checked): Contains `stylistic` + additional stylistic rules that require type information.

:::note
These configurations are our recommended starting points, but **you don't need to use them as-is**.
ESLint allows configuring own rule settings on top of extended configurations.
See [ESLint's Configuring Rules docs](https://eslint.org/docs/user-guide/configuring/rules#using-configuration-files).
:::

### `recommended`

Recommended rules for code correctness that you can drop in without additional configuration.
These rules are those whose reports are almost always for a bad practice and/or likely bug.
`recommended` also disables core ESLint rules known to conflict with typescript-eslint rules or cause issues in TypeScript codebases.

<Tabs groupId="eslint-config">
<TabItem value="Flat Config">

{/* prettier-ignore */}
```js title="eslint.config.mjs"
export default defineConfig(
  tseslint.configs.recommended,
);
```

</TabItem>
<TabItem value="Legacy Config">

```js title=".eslintrc.js"
module.exports = {
  extends: ['plugin:@typescript-eslint/recommended'],
};
```

</TabItem>
</Tabs>

See [the source code for the `recommended` config](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/src/configs/eslintrc/recommended.ts) for the exact contents.

### `recommended-type-checked`

Contains all of `recommended` along with additional recommended rules that require type information.
Rules newly added in this configuration are similarly useful to those in `recommended`.

<Tabs groupId="eslint-config">
<TabItem value="Flat Config">

{/* prettier-ignore */}
```js title="eslint.config.mjs"
export default defineConfig(
  tseslint.configs.recommendedTypeChecked,
);
```

</TabItem>
<TabItem value="Legacy Config">

```js title=".eslintrc.js"
module.exports = {
  extends: ['plugin:@typescript-eslint/recommended-type-checked'],
};
```

</TabItem>
</Tabs>

See [the source code for the `recommended-type-checked` config](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/src/configs/eslintrc/recommended-type-checked.ts) for the exact contents.

### `strict`

Contains all of `recommended`, as well as additional strict rules that can also catch bugs.
Rules added in `strict` are more opinionated than recommended rules and might not apply to all projects.

<Tabs groupId="eslint-config">
<TabItem value="Flat Config">

{/* prettier-ignore */}
```js title="eslint.config.mjs"
export default defineConfig(
  tseslint.configs.strict,
);
```

</TabItem>
<TabItem value="Legacy Config">

```js title=".eslintrc.js"
module.exports = {
  extends: ['plugin:@typescript-eslint/strict'],
};
```

</TabItem>
</Tabs>

Some rules also enabled in `recommended` default to more strict settings in this configuration.
See [the source code for the `strict` config](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/src/configs/eslintrc/strict.ts) for the exact contents.

:::tip
We recommend a TypeScript project extend from `plugin:@typescript-eslint/strict` only if a nontrivial percentage of its developers are highly proficient in TypeScript.
:::

:::warning
This configuration is not considered "stable" under Semantic Versioning (semver).
Its enabled rules and/or their options may change outside of major version updates.
:::

### `strict-type-checked`

Contains all of `recommended`, `recommended-type-checked`, and `strict`, along with additional strict rules that require type information.
Rules newly added in this configuration are similarly useful (and opinionated) to those in `strict`.

<Tabs groupId="eslint-config">
<TabItem value="Flat Config">

{/* prettier-ignore */}
```js title="eslint.config.mjs"
export default defineConfig(
  tseslint.configs.strictTypeChecked,
);
```

</TabItem>
<TabItem value="Legacy Config">

```js title=".eslintrc.js"
module.exports = {
  extends: ['plugin:@typescript-eslint/strict-type-checked'],
};
```

</TabItem>
</Tabs>

Some rules also enabled in `recommended-type-checked` default to more strict settings in this configuration.
See [the source code for the `strict-type-checked` config](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/src/configs/eslintrc/strict-type-checked.ts) for the exact contents.

:::tip
We recommend a TypeScript project extend from `plugin:@typescript-eslint/strict-type-checked` only if a nontrivial percentage of its developers are highly proficient in TypeScript.
:::

:::warning
This configuration is not considered "stable" under Semantic Versioning (semver).
Its enabled rules and/or their options may change outside of major version updates.
:::

### `stylistic`

Rules considered to be best practice for modern TypeScript codebases, but that do not impact program logic.
These rules are generally opinionated about enforcing simpler code patterns.

<Tabs groupId="eslint-config">
<TabItem value="Flat Config">

{/* prettier-ignore */}
```js title="eslint.config.mjs"
export default defineConfig(
  tseslint.configs.stylistic,
);
```

</TabItem>
<TabItem value="Legacy Config">

```js title=".eslintrc.js"
module.exports = {
  extends: ['plugin:@typescript-eslint/stylistic'],
};
```

</TabItem>
</Tabs>

Note that `stylistic` does not replace `recommended` or `strict`.
`stylistic` adds additional rules.

See [the source code for the `stylistic` config](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/src/configs/eslintrc/stylistic.ts) for the exact contents.

### `stylistic-type-checked`

Contains all of `stylistic`, along with additional stylistic rules that require type information.
Rules newly added in this configuration are similarly opinionated to those in `stylistic`.

<Tabs groupId="eslint-config">
<TabItem value="Flat Config">

{/* prettier-ignore */}
```js title="eslint.config.mjs"
export default defineConfig(
  tseslint.configs.stylisticTypeChecked,
);
```

</TabItem>
<TabItem value="Legacy Config">

```js title=".eslintrc.js"
module.exports = {
  extends: ['plugin:@typescript-eslint/stylistic-type-checked'],
};
```

</TabItem>
</Tabs>

Note that `stylistic-type-checked` does not replace `recommended-type-checked` or `strict-type-checked`.
`stylistic-type-checked` adds additional rules.

See [the source code for the `stylistic-type-checked` config](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/src/configs/eslintrc/stylistic-type-checked.ts) for the exact contents.

## Other Configurations

typescript-eslint includes a few utility configurations.

### `all`

Enables each the rules provided as a part of typescript-eslint.
Note that many rules are not applicable in all codebases, or are meant to be configured.

See [the source code for the `all` config](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/src/configs/eslintrc/all.ts) for the exact contents.

:::warning
We do not recommend TypeScript projects extend from `plugin:@typescript-eslint/all`.
Many rules conflict with each other and/or are intended to be configured per-project.
:::

:::warning
This configuration is not considered "stable" under Semantic Versioning (semver).
Its enabled rules and/or their options may change outside of major version updates.
:::

### `base`

A minimal ruleset that sets only the required parser and plugin options needed to run typescript-eslint.
We don't recommend using this directly; instead, extend from an earlier recommended rule.

This config is automatically included if you use any of the recommended configurations.

See [the source code for the `base` config](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/src/configs/eslintrc/base.ts) for the exact contents.

### `disable-type-checked`

A utility ruleset that will disable type-aware linting and all type-aware rules available in our project.
This config is useful if you'd like to have your base config concerned with type-aware linting, and then conditionally use [overrides](https://eslint.org/docs/latest/use/configure/configuration-files#configuration-based-on-glob-patterns) to disable type-aware linting on specific subsets of your codebase.

See [the source code for the `disable-type-checked` config](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/src/configs/eslintrc/disable-type-checked.ts) for the exact contents.

:::info
If you use type-aware rules from other plugins, you will need to manually disable these rules or use a premade config they provide to disable them.
:::

<Tabs groupId="eslint-config">
<TabItem value="Flat Config">

```js title="eslint.config.mjs"
export default defineConfig(
  js.configs.recommended,
  tseslint.configs.recommendedTypeChecked,
  {
    languageOptions: {
      parserOptions: {
        projectService: true,
      },
    },
  },
  // Added lines start
  {
    files: ['**/*.js'],
    extends: [tseslint.configs.disableTypeChecked],
  },
  // Added lines end
);
```

</TabItem>
<TabItem value="Legacy Config">

```js title=".eslintrc.js"
module.exports = {
  extends: [
    'eslint:recommended',
    'plugin:@typescript-eslint/recommended-type-checked',
  ],
  parser: '@typescript-eslint',
  parserOptions: {
    projectService: true,
    __tsconfigRootDir: __dirname,
  },
  root: true,
  // Added lines start
  overrides: [
    {
      files: ['**/*.js'],
      extends: ['plugin:@typescript-eslint/disable-type-checked'],
    },
  ],
  // Added lines end
};
```

</TabItem>
</Tabs>

:::warning
This configuration is not considered "stable" under Semantic Versioning (semver).
Its enabled rules and/or their options may change outside of major version updates.
:::

### `eslint-recommended`

This ruleset is meant to be used after extending `eslint:recommended`.
It disables core ESLint rules that are already checked by the TypeScript compiler.
Additionally, it enables rules that promote using the more modern constructs TypeScript allows for.

<Tabs groupId="eslint-config">
<TabItem value="Flat Config">

```js title="eslint.config.mjs"
export default defineConfig(
  js.configs.recommended,
  tseslint.configs.eslintRecommended,
);
```

</TabItem>
<TabItem value="Legacy Config">

```js title=".eslintrc.js"
module.exports = {
  extends: [
    'eslint:recommended',
    'plugin:@typescript-eslint/eslint-recommended',
  ],
};
```

</TabItem>
</Tabs>

This config is automatically included if you use any of the recommended configurations.

See [the source code for the `eslint-recommended` config](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/src/configs/eslint-recommended-raw.ts) for the exact contents.

### `recommended-type-checked-only`

A version of `recommended` that _only_ contains type-checked rules and disables of any corresponding core ESLint rules.
This config plus `recommended` is equivalent to `recommended-type-checked`.

```js title=".eslintrc.js"
module.exports = {
  extends: ['plugin:@typescript-eslint/recommended-type-checked-only'],
};
```

See [the source code for the `recommended-type-checked-only` config](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/src/configs/eslintrc/recommended-type-checked-only.ts) for the exact contents.

### `strict-type-checked-only`

A version of `strict` that _only_ contains type-checked rules and disables of any corresponding core ESLint rules.
This config plus `strict` is equivalent to `strict-type-checked`.

```js title=".eslintrc.js"
module.exports = {
  extends: ['plugin:@typescript-eslint/strict-type-checked-only'],
};
```

See [the source code for the `strict-type-checked-only` config](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/src/configs/eslintrc/strict-type-checked-only.ts) for the exact contents.

:::warning
This configuration is not considered "stable" under Semantic Versioning (semver).
Its enabled rules and/or their options may change outside of major version updates.
:::

### `stylistic-type-checked-only`

A version of `stylistic` that _only_ contains type-checked rules and disables of any corresponding core ESLint rules.
This config plus `stylistic` is equivalent to `stylistic-type-checked`.

```js title=".eslintrc.js"
module.exports = {
  extends: ['plugin:@typescript-eslint/stylistic-type-checked-only'],
};
```

See [the source code for the `stylistic-type-checked-only` config](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/src/configs/eslintrc/stylistic-type-checked-only.ts) for the exact contents.

## Suggesting Configuration Changes

If you feel strongly that a specific rule should (or should not) be one of these configurations, please [file an issue](https://github.com/typescript-eslint/typescript-eslint/issues/new?assignees=&labels=package%3A+eslint-plugin%2Cpreset+config+change%2Ctriage&template=09-config-change.yaml&title=Configs%3A+%3Ca+short+description+of+my+proposal%3E) along with a **detailed** argument explaining your reasoning.

## Formatting

None of the preset configs provided by typescript-eslint enable formatting rules (rules that only serve to enforce code whitespace and other trivia).
We strongly recommend you use Prettier or an equivalent for formatting your code, not ESLint formatting rules.
See [What About Formatting? > Suggested Usage](./What_About_Formatting.mdx#suggested-usage---prettier).
