ESLint & Prettier Cheat Sheet

Covers ESLint flat config, Prettier formatting options, integrating the two tools without conflicts, and common linting commands.

2 PagesBeginnerMar 8, 2026

ESLint Flat Config

Configuring rules with ESLint 9's flat config format.

javascript

// eslint.config.jsimport js from '@eslint/js';export default [  js.configs.recommended,  {    rules: {      'no-unused-vars': 'warn',      'eqeqeq': 'error',   // require === / !== over == / !=      'no-console': 'off',    },    languageOptions: {      ecmaVersion: 2022,      sourceType: 'module',    },  },];

Prettier Configuration

Formatting rules and ignored paths.

json

{  "semi": true,  "singleQuote": true,  "trailingComma": "es5",  "printWidth": 80,  "tabWidth": 2}

Combining ESLint + Prettier

Preventing the two tools from fighting over formatting.

bash

# npm install -D eslint prettier eslint-config-prettier

package.json Scripts

Common lint and format script entries.

json

{  "scripts": {    "lint": "eslint . --fix",    "format": "prettier --write ."  }}

Common Rules & CLI

Frequently used flags and packages.

eslint --fix- auto-fixes any lint violations that have a known fix
eslint --init- interactive wizard to scaffold a starting configuration
no-undef- flags use of undeclared variables
eslint-plugin-react-hooks- enforces the Rules of Hooks in React components
prettier --check .- verifies formatting without writing changes, ideal for CI
eslint-config-prettier- disables ESLint stylistic rules that would conflict with Prettier

Pro Tip

Let ESLint own code-quality rules (unused vars, hooks rules) and Prettier own formatting: apply eslint-config-prettier last in your config to disable ESLint's formatting rules instead of trying to make both tools agree on style.

Was this cheat sheet helpful?

Babel Cheat Sheet

npm & Yarn Cheat Sheet

Explore Topics

#ESLintPrettier#ESLintPrettierCheatSheet#WebDevelopment#Beginner#ESLintFlatConfig#PrettierConfiguration#CombiningESLintPrettier#PackageJsonScripts#CheatSheet#SkillVeris

Sri Hayavadhana Info-Tech

Professional Web Designing Services