Lint-Staged Configuration Skill

Purpose

Generate lint-staged configuration to automatically fix and format staged files before commit.

🚨 MANDATORY FILE COUNT

This skill MUST create exactly 1 file:

• .lintstagedrc.json

  (preferred format)

🔍 BEFORE GENERATING - CRITICAL RESEARCH REQUIRED

⚠️ HIGH PRIORITY: Verify current tool CLI flags to prevent outdated commands

Required Research Steps:

1. ESLint CLI Flags: Verify

   eslint --fix

   is still the correct flag
   • Check if ESLint CLI has deprecated or changed flags
   • Verify

     --fix

     flag still works with current ESLint version
2. Prettier CLI Flags: Verify

   prettier --write

   is still correct
   • Check if Prettier CLI has changed flags
   • Verify

     --write

     flag syntax hasn't changed
3. Stylelint CLI (if project uses Stylelint):
   • Check

     package.json

     for

     stylelint

     dependency
   • If found: Verify

     stylelint --fix

     is correct flag
   • Include style file patterns in configuration
4. File Patterns: Verify glob patterns work with lint-staged version
   • Check if pattern syntax has changed
   • Verify file extension support (jsx, tsx, css, scss)
5. Command Chaining: Verify array of commands still executes sequentially
6. Alternative Formats: Check if

   .lintstagedrc.json

   is still recommended format
   • Verify not deprecated in favor of

     .lintstagedrc.js

     or package.json field

Output

Create the file:

.lintstagedrc.json

Supported Format:

• .lintstagedrc.json

  (strict preferred format - simple JSON configuration)

Alternative Formats (only if JSON deprecated):

• .lintstagedrc.js

  (JavaScript with dynamic logic)

• lint-staged

  field in

  package.json

• .lintstagedrc.cjs

  (CommonJS format)

Example File

See:

examples.md

in this directory for complete examples and detailed explanations.

⚠️ IMPORTANT: The examples.md file contains December 2025 configurations. Always verify current CLI flags before using.

Execution Checklist

• Research current ESLint CLI flags (verify

  --fix

  )
• Research current Prettier CLI flags (verify

  --write

  )
• Check if project has Stylelint in package.json
• If Stylelint found, verify

  stylelint --fix

  flag
• Determine file patterns based on project needs (jsx/tsx/css/scss)
• Verify lint-staged glob pattern syntax hasn't changed
• Create

  .lintstagedrc.json

  with appropriate commands and patterns
• Verify JSON format is still recommended (not deprecated)

🛑 BLOCKING VALIDATION CHECKPOINT

STOP! Before proceeding to the next skill, verify:

Automated Verification

Run this command to verify the file exists:

if [ -f ".lintstagedrc.json" ] || [ -f ".lintstagedrc.js" ] || [ -f ".lintstagedrc.cjs" ] || grep -q "lint-staged" package.json 2>/dev/null; then
  echo "✓ Lint-staged configuration found"
  if [ -f ".lintstagedrc.json" ]; then
    echo "✓ Using .lintstagedrc.json (preferred format)"
    # Validate JSON syntax
    if command -v jq >/dev/null 2>&1; then
      jq empty .lintstagedrc.json && echo "✓ Valid JSON syntax" || echo "✗ Invalid JSON syntax"
    fi
  fi
else
  echo "✗ Lint-staged configuration missing"
  exit 1
fi

Manual Verification

1. ✓

   .lintstagedrc.json

   exists at project root
2. ✓ File contains valid JSON syntax
3. ✓ File includes ESLint command with current flags
4. ✓ File includes Prettier command with current flags
5. ✓ File patterns match project file types (js/ts/vue, optionally jsx/tsx/css/scss)
6. ✓ Commands use current CLI flags (not deprecated)
7. ✓ If Stylelint in project, style files have stylelint command

If Validation Fails

DO NOT PROCEED to the next skill. Create or fix the missing/incorrect file immediately.

Notes

• ESLint Auto-Fix: Runs

  eslint --fix

  on JS/TS/Vue files (verify flag current)
• Prettier Formatting: Runs

  prettier --write

  on code and config files (verify flag current)
• Fast and Efficient: Only processes staged files, not entire codebase
• Husky Integration: Works with pre-commit hook for automated quality checks
• Prevents Bad Commits: Blocks commits that don't meet linting standards
• Sequential Execution: Commands in array run sequentially for each file
• File Patterns: Supports glob patterns (

  *.{js,ts,vue}

  ,

  *.{css,scss}

  )
• Extended Patterns: Include jsx/tsx if React, css/scss if using style files
• Stylelint Optional: Only include if project has

  stylelint

  in package.json
• Always verify current CLI flags - Tools may change flag syntax
• JSON Format Preferred: Simple, declarative, works without build step
• Command Arrays: Multiple commands per pattern run sequentially on same files