`@justia/eslint-config-rts`

Justia's ESLint configuration for React and TypeScript projects

This package is a combination of @justia/eslint-config-react and @justia/eslint-config-ts with small modifications to React and prettier rules to support the combination of React and TypeScript.

Install

Install the correct versions of the peer dependencies, which are listed by the command:

npm info "@justia/eslint-config-rts@latest" peerDependencies

If using npm 5+, use this shortcut

npx install-peerdeps --dev @justia/eslint-config-rts

If using npm < 5, Linux/OSX users can run

(
export PKG=@justia/eslint-config-rts;
npm info "$PKG@latest" peerDependencies --json | command sed 's/[\{\},]//g ; s/: /@/g' | xargs npm install --save-dev "$PKG@latest"
)

Which produces and runs a command like:

npm install --save-dev @justia/eslint-config-rts eslint@^#.#.# prettier@^#.#.# eslint-config-prettier@^#.#.# eslint-plugin-import@^#.#.# eslint-plugin-prettier@^#.#.# eslint-plugin-promise@^#.#.# eslint-plugin-jsx-a11y@^#.#.# eslint-plugin-react@^#.#.# eslint-plugin-react-hooks@^#.#.# @typescript-eslint/parser@^#.#.# @typescript-eslint/eslint-plugin@^#.#.#

Usage

This configuration contains all of our ESLint rules, including ECMAScript 6+, TypeScript and formatting styles. It requires the following external packages:

eslint
prettier
eslint-config-prettier
eslint-plugin-import
eslint-plugin-prettier
eslint-plugin-promise
eslint-plugin-jsx-a11y
eslint-plugin-react
eslint-plugin-react-hooks
@typescript-eslint/parser
@typescript-eslint/eslint-plugin

After installation of packages and its peer dependencies, add the following configuration to your ESLint configuration file:

{
    "extends": ["@justia/eslint-config-rts"],
    "parserOptions": {
        "project": "./tsconfig.json"
    }
}

Alter your eslint command to include ts files:

eslint --ext .js,.jsx,.ts,.tsx ./

VS Code Issue

For those how use VS Code, it is possible you are getting the following error message:

Parsing error: "parserOptions.project" has been set for @typescript-eslint/parser. The file does not match your project config: .eslintrc.js. The file must be included in at least one of the projects provided.

To fix it you will need to add a ESLint-specific TypeScript configuration file (tsconfig.eslint.json):

{
    "extends": "./tsconfig.json",
    "compilerOptions": {
        "noEmit": true
    },
    "include": [
        ".eslintrc.js",
        // Also re-add the patterns you define in the original `include` key.
    ]
}

Then change the parserOptions.project to tsconfig.eslint.json.