@rfgamaral/eslint-config-typescript-unified

A unified ESLint configuration with sensible defaults for TypeScript projects.

Installation

This package provides multiple ESLint Shareable Configurations for your convenience. To make use of any of them, you must first install eslint, prettier and typescript since this package does not do it for you. Then install it with:

# npm
npm install --save-dev @rfgamaral/eslint-config-typescript-unified

# Yarn
yarn add --dev @rfgamaral/eslint-config-typescript-unified

Usage

Once @rfgamaral/eslint-config-typescript-unified is installed, you can use any of the available configurations in the extends section of your ESLint configuration.

Default

Default configuration with recommended rules from @typescript-eslint/eslint-plugin and eslint-plugin-prettier:

{
  "extends": "@rfgamaral/eslint-config-typescript-unified"
}

ESLint

Extends the default configuration with recommended rules from ESLint:

{
  "extends": "@rfgamaral/eslint-config-typescript-unified/eslint"
}

Airbnb

Extends the default configuration with base rules from Aribnb:

{
  "extends": "@rfgamaral/eslint-config-typescript-unified/airbnb"
}

Airbnb (React)

Extends the Airbnb configuration with React rules from Airbnb:

{
  "extends": "@rfgamaral/eslint-config-typescript-unified/airbnb-react"
}

Airbnb (React + Hooks)

Extends the Airbnb React configuration with Hooks rules from Airbnb:

{
  "extends": "@rfgamaral/eslint-config-typescript-unified/airbnb-react-hooks"
}

Recommended

Extends the Airbnb configuration with my own opinionated rules:

{
  "extends": "@rfgamaral/eslint-config-typescript-unified/recommended"
}

Recommended (React)

Extends the Airbnb (React) configuration with my own opinionated rules:

{
  "extends": "@rfgamaral/eslint-config-typescript-unified/recommended-react"
}

Recommended (React + Hooks)

Extends the Airbnb (React + Hooks) configuration with my own opinionated rules:

{
  "extends": "@rfgamaral/eslint-config-typescript-unified/recommended-react-hooks"
}

Semantics (type-checking)

For all the configurations mentioned above, the TypeScript rules are fast feedback rules which operate purely based on syntax (no type-checking). If you want some additional highly valuable rules that operate on semantics (type-checking), just suffix any of the configuration names above with -semantics. You can read a little bit more about it here.

Frequently Asked Questions

Why is ESLint's no-undef rule disabled?

This rule is disabled to prevent ESLint from reporting no-undef false positives for Interfaces and Types. More details at typescript-eslint/typescript-eslint#342.

The TypeScript compiler will catch undeclared variables by default, so we don't need this rule.

Why are *.d.ts files being ignored for all Airbnb and Recommended configurations?

Airbnb and Recommended configurations make use of eslint-plugin-import which triggers import/no-cycle false positives for cyclic dependencies between type imports. More details at benmosher/eslint-plugin-import#1453.

How to configure a mixed JavaScript/TypeScript codebase with any of the Recommended configurations?

Recommended configurations require explicit return types on functions and class methods (explicit-function-return-type) which triggers false positives for JavaScript files. To workaround that, please ensure add the following override to disable the rule for .js and .jsx files:

{
  "overrides": [
    {
      "files": ["*.{js,jsx}"],
      "rules": {
        "@typescript-eslint/explicit-function-return-type": "off"
      }
    }
  ]
}

License

The use of this source code is governed by an MIT-style license that can be found in the LICENSE file.