eslint-config-with-prettier

6.0.0 verified Sat Apr 25 auth: no javascript maintenance

An ESLint shareable config that combines Airbnb's base configuration with Prettier for automatic code formatting. Version 6.0.0 supports Node >=6 and includes plugins for React, JSX-a11y, import, Flow, and Jest. It extends eslint-config-airbnb and eslint-config-prettier, using eslint-plugin-prettier to run Prettier as an ESLint rule. The package aims to provide a zero-config setup similar to create-react-app's eslint experience, bundling all necessary dependencies. It also includes a bash setup script for additional project configuration, though this is deprecated in favor of manual setup. Release cadence is low; this package is primarily a convenience wrapper for common tooling.

Common errors

error Error: Failed to load plugin 'prettier' declared in 'eslint-config-with-prettier': Cannot find module 'eslint-plugin-prettier' ↓

cause Missing required peer dependency

fix

npm install --save-dev eslint-plugin-prettier

error Error: Cannot find module 'eslint-config-airbnb' ↓

cause Missing required peer dependency

fix

npm install --save-dev eslint-config-airbnb

error Parsing error: Unexpected token ... (or other JSX/ES2015+ syntax) ↓

cause ESLint parser not configured for modern syntax

fix

Ensure babel-eslint is installed and configured if needed; this config may not include it.

Warnings

deprecated The setup.sh script is outdated and may cause unintended changes. Use at your own risk. ↓

fix Manually configure ESLint and Prettier instead of running the setup script.

gotcha The package requires multiple peer dependencies that are not automatically installed (eslint, prettier, eslint-config-airbnb, etc.). ↓

fix Run npm info eslint-config-with-prettier peerDependencies and install each listed package.

gotcha With this config, prettier formatting is applied on eslint --fix, which may reformat code unexpectedly. ↓

fix Run prettier separately or use eslint --fix with caution; review changes before committing.

Install

npm install eslint-config-with-prettier

yarn add eslint-config-with-prettier

pnpm add eslint-config-with-prettier

Imports

extends

wrong

extends: 'eslint-config-with-prettier' (missing array brackets)

correct

extends: ['eslint-config-with-prettier']

In .eslintrc, the extends field must be an array, even for one config.

plugins
wrong
```
extends: ['eslint-config-with-prettier'] and plugins as string
```
correct
```
plugins: ['dollar-sign']
```
Additional plugins like eslint-plugin-dollar-sign can be added alongside the config.

rules

wrong

rules: { 'dollar-sign/dollar-sign': 'error' } (missing array for options)

correct

rules: { 'dollar-sign/dollar-sign': ['error', 'ignoreProperties'] }

ESLint rules with options require an array syntax.

Quickstart

Install the config package and create an .eslintrc file extending the preset.

npm install --save-dev eslint-config-with-prettier
# Then create .eslintrc.json:
{
  "extends": ["eslint-config-with-prettier"]
}