# eslint-prettier-react-config

> ESLint + Prettier config for React

Latest version **1.0.4** (published 2021-10-03) · MIT license · 0 weekly downloads

## Install

```sh
npm install eslint-prettier-react-config
pnpm add eslint-prettier-react-config
yarn add eslint-prettier-react-config
bun add eslint-prettier-react-config
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.4 |
| Published | 2021-10-03 |
| First published | 2021-10-03 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 7.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Sumit Walmiki |
| Maintainers | sumit_walmiki |
| Keywords | config, ecmascript, eslint, eslintconfig, javascript, lint, react, prettier |

## Links

- npm: https://www.npmjs.com/package/eslint-prettier-react-config
- Repository: https://github.com/walmiki/eslint-prettier-setup-config
- Homepage: https://github.com/walmiki/eslint-prettier-setup-config#readme
- Issues: https://github.com/walmiki/eslint-prettier-setup-config/issues
- npm.io page: https://npm.io/package/eslint-prettier-react-config

## Alternatives

- [eslint-plugin-sonarjs](https://npm.io/package/eslint-plugin-sonarjs.md) — 2.9M weekly downloads
- [eslint-config-expo](https://npm.io/package/eslint-config-expo.md) — 1.5M weekly downloads
- [@matter/protocol](https://npm.io/package/@matter/protocol.md) — 63.5K weekly downloads
- [@eventcatalog/linter](https://npm.io/package/@eventcatalog/linter.md) — 24.8K weekly downloads
- [@pandacss/eslint-plugin](https://npm.io/package/@pandacss/eslint-plugin.md) — 18.7K weekly downloads

## Recent versions

- 1.0.4 (latest) — 2021-10-03
- 1.0.3 — 2021-10-03
- 1.0.1 — 2021-10-03
- 1.0.0 — 2021-10-03

## README

## Forked from [mryechkin](https://github.com/mryechkin/eslint-config-acme)
# ESLint + Prettier Config for React (Next.js)

`eslint-prettier-react-config`

> Shareable config for [ESLint](https://eslint.org/) and [Prettier](https://prettier.io/), aimed primarily to be used in [Next.js](https://nextjs.org) React projects.

## Overview

This configuration extends [airbnb](https://www.npmjs.com/package/eslint-config-airbnb) ESLint config, with [airbnb/hooks](https://github.com/airbnb/javascript/tree/master/packages/eslint-config-airbnb#eslint-config-airbnbhooks) enabled, and Prettier integration via the ESLint [plugin](https://github.com/prettier/eslint-plugin-prettier). Additionally, a few default rules are overriden to provide a more relaxed development experience in Next.js applications out of the box.

The goal of this configuration is to get code linting and formatting up and running as quickly as possible in a modern development environment, without sacrificing cleanliness and readability, and having to configure ESLint + Prettier from scratch every time.

## Installation

To install the package, run:

```shell
$ npm install -D eslint-prettier-react-config
```

This will install the shared config, as well as its peer dependencies:

- eslint
- eslint-config-airbnb
- eslint-config-prettier
- eslint-plugin-import
- eslint-plugin-jsx-a11y
- eslint-plugin-prettier
- eslint-plugin-react
- eslint-plugin-react-hooks
- prettier

**NOTE:** if you are on an older version of `npm` (`<7.0.0`), you will need to install these manually:

```shell
$ npx install-peerdeps -D eslint-prettier-react-config
```

## Usage

To start using this shared config, add `eslint-prettier-react-config` (or just `acme`) to either your `package.json`:

```jsx
// package.json
{
  "eslintConfig": {
    "extends": ["acme"]
  }
}
```

or the `.eslintrc` file:

```jsx
// .eslintrc
{
  "extends": ["acme"]
}
```

## Prettier

This config supports Prettier integration out of the box. Rules that may conflict with ESLint are disabled via recommended configuration in [eslint-plugin-prettier](https://github.com/prettier/eslint-plugin-prettier).

If you wish to override any [Prettier options](https://prettier.io/docs/en/options.html), you can do so by specifying them under `prettier/prettier` rule in your ESLint config file. For example:

```jsx
// .eslintrc
{
  "extends": "@acme",
  "rules": {
    "prettier/prettier": [
      "error",
      {
        "printWidth": 110
      }
    ]
  }
}
```

Make sure that these rules match the options specified in your `.prettierrc` file.

## Adding Scripts

Add the following to your `package.json` file to define a script that will lint all known files and output the results:

```jsx
"scripts": {
  // ..
  "lint": "eslint --ignore-path .gitignore ."
  // ..
}
```

To fix all automatically-fixable issues, you can add the following script to your `package.json` as well (in addition to above):

```jsx
"scripts": {
  // ..
  "lint:fix": "eslint --ignore-path .gitignore --fix ."
  // ..
}
```

Note that you can update the above scripts as you see fit, this is just an example. See ESLint [CLI reference](https://eslint.org/docs/user-guide/command-line-interface) for more details.

## License

Licensed under MIT License.

---
_Source: https://npm.io/package/eslint-prettier-react-config · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
