Skip to main content

Legacy ESLint Setup

Quickstart

These steps will get you running ESLint with our recommended rules on your TypeScript code as quickly as possible.

Step 1: Installation

First, install the required packages for ESLint, TypeScript, and this plugin:

npm install --save-dev @typescript-eslint/parser @typescript-eslint/eslint-plugin eslint typescript

Step 2: Configuration

Next, create a .eslintrc.cjs config file in the root of your project, and populate it with the following:

.eslintrc.cjs
/* eslint-env node */
module.exports = {
extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended'],
parser: '@typescript-eslint/parser',
plugins: ['@typescript-eslint'],
root: true,
};
info

If your project doesn't use ESM, naming the file as .eslintrc.js is fine. See ESLint's Configuration Files docs for more info.

Step 3: Running ESLint

Open a terminal to the root of your project and run the following command:

npx eslint .

ESLint will lint all TypeScript compatible files within the current folder, and will output the results to your terminal.

Details

  • parser: '@typescript-eslint/parser' tells ESLint to use the @typescript-eslint/parser package you installed to parse your source files.
    • This is required, or else ESLint will throw errors as it tries to parse TypeScript code as if it were regular JavaScript.
  • plugins: ['@typescript-eslint'] tells ESLint to load the @typescript-eslint/eslint-plugin package as a plugin.
    • This allows you to use typescript-eslint's rules within your codebase.
  • extends: [ ... ] tells ESLint that your config extends the given configurations.
    • eslint:recommended is ESLint's inbuilt "recommended" config - it turns on a small, sensible set of rules which lint for well-known best-practices.
    • plugin:@typescript-eslint/recommended is our "recommended" config - it's similar to eslint:recommended, except it turns on TypeScript-specific rules from our plugin.
  • root: true is a generally good ESLint practice to indicate this file is the root-level one used by the project and ESLint should not search beyond this directory for config files.

Next Steps

If you're having problems getting this working, please have a look at our Troubleshooting & FAQs.

Additional Configs

We recommend you consider enabling the following two configs:

  • strict: a superset of recommended that includes more opinionated rules which may also catch bugs.
  • stylistic: additional rules that enforce consistent styling without significantly catching bugs or changing logic.
.eslintrc.cjs
/* eslint-env node */
module.exports = {
extends: [
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
'plugin:@typescript-eslint/strict',
'plugin:@typescript-eslint/stylistic',
],
parser: '@typescript-eslint/parser',
plugins: ['@typescript-eslint'],
root: true,
};

You can read more about these in our shared configurations docs.

Typed Linting

We also provide a plethora of powerful rules that utilize the power of TypeScript's type information. Visit the next page for a typed rules setup guide.

Documentation Resources