# Integrating ESLint and Prettier — ESLint + Prettier

Source: https://www.geekswithgeeks.com/en/eslint-prettier/eslint-prettier-05

> Make ESLint and Prettier work together without conflicts.

## The conflict problem

ESLint and Prettier can conflict: ESLint checks quotes, Prettier enforces them differently. Use eslint-config-prettier to disable ESLint's formatting rules.

## Conflict-free setup

Install eslint-config-prettier and add it to your extends list last.

```bash
npm install --save-dev eslint-config-prettier
# Then in .eslintrc.json, add to extends array:
"extends": ["eslint:recommended", "prettier"]
```

Output:

```
eslint-config-prettier installed and configured
```

## Order matters

Always put 'prettier' last in your extends array. This ensures Prettier config overrides ESLint formatting rules.

Quick check

**Quiz:** Why install eslint-config-prettier?

- [x] To prevent ESLint and Prettier from conflicting over formatting.
- [ ] To make Prettier faster.
- [ ] To enable new ESLint rules.

*Answer:* To prevent ESLint and Prettier from conflicting over formatting.. eslint-config-prettier disables ESLint rules that conflict with Prettier, ensuring they work harmoniously.