Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/tim-w-james/eslint-config

Opinionated eslint ruleset for React and TypeScript
https://github.com/tim-w-james/eslint-config

eslint eslint-config jest jsdoc prettier react typescript

Last synced: 26 days ago
JSON representation

Opinionated eslint ruleset for React and TypeScript

Host: GitHub
URL: https://github.com/tim-w-james/eslint-config
Owner: Tim-W-James
License: mit
Created: 2022-11-26T01:15:33.000Z (almost 2 years ago)
Default Branch: main
Last Pushed: 2024-08-08T12:42:35.000Z (3 months ago)
Last Synced: 2024-09-25T00:07:12.708Z (about 1 month ago)
Topics: eslint, eslint-config, jest, jsdoc, prettier, react, typescript
Language: JavaScript
Homepage: https://www.npmjs.com/package/@tim-w-james/eslint-config
Size: 377 KB
Stars: 12
Watchers: 1
Forks: 1
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE.txt

Awesome Lists containing this project

README

# ESLint Config React TypeScript

Opinionated ESLint rule set for React and TypeScript. Emphasis on auto-fixable
rules that encourage consistency, safety and readability across your code base.

Read [this](https://timjames.dev/blog/the-best-eslint-rules-for-react-projects-30i8) blog post describing my general approach.

Note that ESLint is in the midst of a major upgrade to version 9, which brings with it significant changes to the configuration syntax. The AirBnB configuration - among other related tools - does not yet support v9. For now, all our documentation and approach refers to the 'legacy' ESLint syntax. Therefore, when using this config, make sure to stick with:

- ESLint 8
- TSESLint 7 (install @typescript-eslint/parser and @typescript-eslint/eslint-plugin, per the guide on [Legacy ESLint Setup](https://typescript-eslint.io/getting-started/legacy-eslint-setup) )

## Install

### `npm`

```sh
npm install -D @tim-w-james/eslint-config \
@typescript-eslint/eslint-plugin@7 \
@typescript-eslint/parser@7 \
eslint@8 \
eslint-config-airbnb \
eslint-config-airbnb-typescript \
eslint-config-prettier \
eslint-plugin-filename-rules \
eslint-plugin-import \
eslint-plugin-jest \
eslint-plugin-jsdoc \
eslint-plugin-jsx-a11y \
eslint-plugin-no-secrets \
eslint-plugin-prefer-arrow-functions \
eslint-plugin-prettier \
eslint-plugin-react \
eslint-plugin-react-hooks \
eslint-plugin-react-refresh \
eslint-plugin-simple-import-sort \
eslint-plugin-sonarjs@^0.25.1 \
eslint-plugin-tsdoc \
prettier \
prettier-plugin-packagejson \
typescript
```

### `yarn`

```sh
yarn add -D @tim-w-james/eslint-config \
@typescript-eslint/eslint-plugin@7 \
@typescript-eslint/parser@7 \
eslint@8 \
eslint-config-airbnb \
eslint-config-airbnb-typescript \
eslint-config-prettier \
eslint-plugin-filename-rules \
eslint-plugin-import \
eslint-plugin-jest \
eslint-plugin-jsdoc \
eslint-plugin-jsx-a11y \
eslint-plugin-no-secrets \
eslint-plugin-prefer-arrow-functions \
eslint-plugin-prettier \
eslint-plugin-react \
eslint-plugin-react-hooks \
eslint-plugin-react-refresh \
eslint-plugin-simple-import-sort \
eslint-plugin-sonarjs@^0.25.1 \
eslint-plugin-tsdoc \
prettier \
prettier-plugin-packagejson \
typescript
```

### `pnpm`

```sh
pnpm add -D @tim-w-james/eslint-config \
@typescript-eslint/eslint-plugin@7 \
@typescript-eslint/parser@7 \
eslint@8 \
eslint-config-airbnb \
eslint-config-airbnb-typescript \
eslint-config-prettier \
eslint-plugin-filename-rules \
eslint-plugin-import \
eslint-plugin-jest \
eslint-plugin-jsdoc \
eslint-plugin-jsx-a11y \
eslint-plugin-no-secrets \
eslint-plugin-prefer-arrow-functions \
eslint-plugin-prettier \
eslint-plugin-react \
eslint-plugin-react-hooks \
eslint-plugin-react-refresh \
eslint-plugin-simple-import-sort \
eslint-plugin-sonarjs@^0.25.1 \
eslint-plugin-tsdoc \
prettier \
prettier-plugin-packagejson \
typescript
```

### `install-peerdeps`

```sh
npx install-peerdeps --dev @tim-w-james/eslint-config
```

Once installed, bump the minimum versions to the latest/desired versions.

## Usage

Add to your `eslintrc` config (for ESLint version 8):

```diff
module.exports = {
+ parser: "@typescript-eslint/parser",
parserOptions: {
+ project: "./tsconfig.json",
+ ecmaVersion: 2018,
+ sourceType: "module",
+ tsconfigRootDir: __dirname,
},
extends: [
+ "@tim-w-james",
...
],
rules: {
...
}
};
```

## Ecosystem

- react
- typescript
- prettier
- tsdoc
- jest

## Extends

- airbnb
- sonarjs
- jsx-ally
- import