Getting Started

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

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

Yarn

yarn add --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

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:

npm

npx eslint .

Yarn

yarn eslint .

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

Details

• You can read more about configuring ESLint in their documentation on configuration.
• You can read more about the rules provided by ESLint in their documentation on their rules.
• You can read more about the rules provided by typescript-eslint in our rules documentation.

Configuration Values

• 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.

Next Steps

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

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