lint-format

name	lint-format
description	Linting and formatting setup with ESLint, Prettier, Ruff, Black, and EditorConfig. Use when user asks to "set up linting", "configure ESLint", "add Prettier", "format code", "set up Ruff", "fix lint errors", "add editorconfig", or any code quality tooling tasks.

Lint & Format

Set up linting and formatting for consistent code quality.

ESLint (JavaScript/TypeScript)

Setup (Flat Config - ESLint 9+)

npm init @eslint/config@latest
# or
npm install -D eslint @eslint/js typescript-eslint

// eslint.config.js
import js from "@eslint/js";
import tseslint from "typescript-eslint";

export default [
  js.configs.recommended,
  ...tseslint.configs.recommended,
  {
    rules: {
      "no-unused-vars": "off",
      "@typescript-eslint/no-unused-vars": ["error", { argsIgnorePattern: "^_" }],
      "@typescript-eslint/no-explicit-any": "warn",
      "no-console": ["warn", { allow: ["warn", "error"] }],
    },
  },
  {
    ignores: ["dist/", "node_modules/", "*.config.js"],
  },
];

With React

npm install -D eslint-plugin-react eslint-plugin-react-hooks

// eslint.config.js
import react from "eslint-plugin-react";
import reactHooks from "eslint-plugin-react-hooks";

export default [
  // ...base config
  {
    plugins: { react, "react-hooks": reactHooks },
    rules: {
      ...reactHooks.configs.recommended.rules,
      "react/react-in-jsx-scope": "off",
      "react/prop-types": "off",
    },
    settings: {
      react: { version: "detect" },
    },
  },
];

Run

npx eslint .
npx eslint --fix .
npx eslint src/
npx eslint "src/**/*.{ts,tsx}"

Prettier

Setup

npm install -D prettier eslint-config-prettier

// .prettierrc
{
  "semi": true,
  "singleQuote": false,
  "tabWidth": 2,
  "trailingComma": "all",
  "printWidth": 100,
  "arrowParens": "always",
  "endOfLine": "lf"
}

// .prettierignore
dist
node_modules
coverage
*.min.js
pnpm-lock.yaml

ESLint + Prettier

// eslint.config.js
import prettier from "eslint-config-prettier";

export default [
  // ...other configs
  prettier,  // Must be last to override conflicting rules
];

Run

npx prettier --write .
npx prettier --check .
npx prettier --write "src/**/*.{ts,tsx,css,json}"

Ruff (Python - Linter + Formatter)

Setup

pip install ruff

# pyproject.toml
[tool.ruff]
target-version = "py312"
line-length = 100

[tool.ruff.lint]
select = [
    "E",    # pycodestyle errors
    "W",    # pycodestyle warnings
    "F",    # pyflakes
    "I",    # isort
    "N",    # pep8-naming
    "UP",   # pyupgrade
    "B",    # flake8-bugbear
    "SIM",  # flake8-simplify
    "TCH",  # flake8-type-checking
]
ignore = [
    "E501",  # line too long (handled by formatter)
]

[tool.ruff.lint.isort]
known-first-party = ["myproject"]

[tool.ruff.format]
quote-style = "double"
indent-style = "space"

Run

# Lint
ruff check .
ruff check --fix .

# Format
ruff format .
ruff format --check .

Black (Python Formatter)

pip install black

# Format
black .
black --check .
black --diff .

# pyproject.toml
[tool.black]
line-length = 100
target-version = ["py312"]

mypy (Python Type Checker)

pip install mypy

mypy src/
mypy --strict src/

# pyproject.toml
[tool.mypy]
python_version = "3.12"
strict = true
warn_return_any = true
warn_unused_configs = true
disallow_untyped_defs = true

EditorConfig

# .editorconfig
root = true

[*]
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
charset = utf-8

[*.{js,ts,tsx,json,css,yml,yaml}]
indent_style = space
indent_size = 2

[*.py]
indent_style = space
indent_size = 4

[*.md]
trim_trailing_whitespace = false

[Makefile]
indent_style = tab

Pre-commit Integration

# Install
npm install -D husky lint-staged

# Setup husky
npx husky init

# .husky/pre-commit
npx lint-staged

// package.json
{
  "lint-staged": {
    "*.{ts,tsx}": ["eslint --fix", "prettier --write"],
    "*.{json,md,yml}": ["prettier --write"],
    "*.py": ["ruff check --fix", "ruff format"]
  }
}

Python pre-commit

# .pre-commit-config.yaml
repos:
  - repo: https://github.com/astral-sh/ruff-pre-commit
    rev: v0.3.0
    hooks:
      - id: ruff
        args: [--fix]
      - id: ruff-format
  - repo: https://github.com/pre-commit/mirrors-mypy
    rev: v1.8.0
    hooks:
      - id: mypy

pip install pre-commit
pre-commit install
pre-commit run --all-files

package.json Scripts

{
  "scripts": {
    "lint": "eslint .",
    "lint:fix": "eslint --fix .",
    "format": "prettier --write .",
    "format:check": "prettier --check .",
    "typecheck": "tsc --noEmit",
    "check": "npm run lint && npm run format:check && npm run typecheck"
  }
}

Reference

For CI integration and configuration recipes: references/configs.md