eslint
ESLint Development
Professional ESLint integration for JavaScript and TypeScript codebases. This skill provides comprehensive guidance for configuring, using, and extending ESLint to enforce code quality standards.
Latest ESLint version: 9.32.2 (December 2025)
Quick Start
Install ESLint
npm install --save-dev eslint
npx eslint --init
Basic Configuration (Flat Config - ESLint 9+)
// eslint.config.js
export default [
{
files: ["**/*.js"],
rules: {
"no-unused-vars": "error",
"no-console": "warn"
}
}
];
Run ESLint
npx eslint . # Lint all files
npx eslint --fix . # Auto-fix issues
npx eslint src/**/*.js # Lint specific files
Core Workflows
1. Project Setup
New projects:
- Install ESLint:
npm install --save-dev eslint - Initialize config:
npx eslint --init(interactive) - Review generated
eslint.config.js - Run first lint:
npx eslint .
Existing projects:
- Review current configuration in
eslint.config.jsor.eslintrc.* - Understand applied rules and plugins
- Migrate to flat config if using legacy format (see references/use/configure/migration-guide.md)
2. Configuration
ESLint uses flat config format (eslint.config.js) in v9+. Legacy formats (.eslintrc.*) are deprecated.
Key configuration areas:
- Files: Specify which files to lint
- Rules: Enable/disable specific rules and set severity
- Language options: Parser, source type, ECMAScript version
- Plugins: Extend with custom rules
- Ignore patterns: Exclude files from linting
See references/use/configure/configuration-files.md for complete guide.
3. Rule Management
Rule severity levels:
"off"or0- Disable rule"warn"or1- Warning (doesn't affect exit code)"error"or2- Error (exit code 1)
Configure rules:
export default [
{
rules: {
"no-unused-vars": "error",
"quotes": ["error", "double"],
"semi": ["error", "always"],
"no-console": "off"
}
}
];
Find specific rule documentation:
- All 300+ core rules documented in references/rules/
- Rule names are kebab-case (e.g.,
no-unused-vars.md,prefer-const.md)
4. Fixing Issues
Auto-fix:
npx eslint --fix . # Fix all auto-fixable issues
npx eslint --fix src/ # Fix specific directory
npx eslint --fix-dry-run . # Preview fixes without applying
Manual fixes:
- Read error message and rule name
- Look up rule in references/rules/[rule-name].md
- Understand the issue and correct code examples
- Apply fix or disable rule if not applicable
Disable rules:
// Disable for one line
// eslint-disable-next-line no-console
console.log("debug");
// Disable for entire file
/* eslint-disable no-console */
// Disable specific rule in block
/* eslint-disable no-unused-vars */
const temp = getData();
/* eslint-enable no-unused-vars */
5. Integration
Editor integration:
- Install ESLint extension for your editor (VS Code, Sublime, etc.)
- Enables real-time linting and auto-fix on save
Build system integration:
- Add to npm scripts:
"lint": "eslint ." - CI/CD: Run
npm run lintin build pipeline - Pre-commit hooks: Use with husky or lint-staged
See references/use/integrations.md for editor and tool integrations.
Advanced Usage
Custom Rules
Create project-specific rules to enforce custom patterns:
// eslint.config.js
import myCustomRule from './rules/my-custom-rule.js';
export default [
{
plugins: {
local: { rules: { 'my-custom-rule': myCustomRule } }
},
rules: {
'local/my-custom-rule': 'error'
}
}
];
See references/extend/custom-rules.md for complete guide.
Plugins
Extend ESLint with community plugins for frameworks and libraries:
import react from 'eslint-plugin-react';
import typescript from '@typescript-eslint/eslint-plugin';
export default [
{
plugins: { react, typescript },
rules: {
'react/jsx-uses-react': 'error',
'@typescript-eslint/no-unused-vars': 'error'
}
}
];
See references/extend/plugins.md for plugin development and usage.
TypeScript
For TypeScript projects, use @typescript-eslint:
npm install --save-dev @typescript-eslint/parser @typescript-eslint/eslint-plugin
import tseslint from '@typescript-eslint/eslint-plugin';
import parser from '@typescript-eslint/parser';
export default [
{
files: ['**/*.ts', '**/*.tsx'],
languageOptions: {
parser: parser,
parserOptions: {
project: './tsconfig.json'
}
},
plugins: { '@typescript-eslint': tseslint },
rules: {
'@typescript-eslint/no-explicit-any': 'warn',
'@typescript-eslint/explicit-function-return-type': 'error'
}
}
];
See references/extend/custom-parsers.md for parser configuration.
Documentation Organization
Complete ESLint documentation is organized in references/:
Core Usage
- references/use/getting-started.md - Initial setup and installation
- references/use/command-line-interface.md - CLI options and flags
- references/use/core-concepts/ - Core ESLint concepts and terminology
Configuration
- references/use/configure/configuration-files.md - Flat config format (v9+)
- references/use/configure/rules.md - Rule configuration patterns
- references/use/configure/language-options.md - Parser and language settings
- references/use/configure/plugins.md - Plugin configuration
- references/use/configure/ignore.md - Ignoring files and directories
- references/use/configure/migration-guide.md - Migrating from legacy config
Rules Reference
- references/rules/ - All 300+ core ESLint rules
- Each rule has its own file (e.g.,
no-console.md,prefer-const.md) - Includes description, examples, options, and use cases
- Organized alphabetically by rule name
- Each rule has its own file (e.g.,
Extension & Customization
- references/extend/custom-rules.md - Creating custom ESLint rules
- references/extend/custom-parsers.md - Building custom parsers
- references/extend/plugins.md - Plugin development and publishing
- references/extend/shareable-configs.md - Creating shareable configurations
- references/extend/selectors.md - AST selectors for advanced rules
Integration
- references/integrate/nodejs-api.md - Programmatic ESLint API usage
- references/use/integrations.md - Editor and tool integrations
Troubleshooting
- references/use/troubleshooting/ - Common error messages and solutions
- Covers plugin loading errors, config resolution issues, and more
Migration Guides
- references/use/migrate-to-9.0.0.md - Migrating to ESLint 9.x
- references/use/migrate-to-8.0.0.md - Migrating to ESLint 8.x
- Additional migration guides for older versions
Common Patterns
Monorepo Configuration
export default [
{
files: ["packages/*/src/**/*.js"],
rules: { "no-console": "error" }
},
{
files: ["packages/cli/src/**/*.js"],
rules: { "no-console": "off" } // Allow console in CLI package
}
];
Environment-Specific Rules
export default [
{
files: ["src/**/*.js"],
rules: { "no-console": "error" }
},
{
files: ["**/*.test.js", "**/*.spec.js"],
rules: { "no-console": "off" } // Allow console in tests
}
];
Shared Configuration
// config/base.js
export default {
rules: {
"no-unused-vars": "error",
"semi": ["error", "always"]
}
};
// eslint.config.js
import baseConfig from './config/base.js';
export default [
baseConfig,
{
files: ["src/**/*.js"],
rules: {
"no-console": "warn"
}
}
];
Best Practices
- Start with recommended config - Use
eslint:recommendedas baseline - Enable auto-fix - Configure editor to fix on save for productivity
- Use strict mode gradually - Start with warnings, upgrade to errors iteratively
- Document exceptions - Add comments when disabling rules
- Keep config organized - Split large configs into multiple files
- Test rule changes - Run linter on entire codebase before committing config changes
- Update regularly - Keep ESLint and plugins up to date for latest rules and fixes
- Use flat config - Migrate to eslint.config.js format (v9+ standard)
Workflow for Fixing Errors
When ESLint reports errors:
- Identify the rule - Look for rule name in error message (e.g.,
no-unused-vars) - Read rule docs - Check references/rules/[rule-name].md
- Review examples - Examine correct/incorrect examples in the docs
- Apply fix - Either fix code or configure rule if not applicable
- Verify - Re-run ESLint to confirm error is resolved
Updating Documentation
To update this skill's documentation when new ESLint versions are released:
See scripts/docs-updater/USAGE.md for complete instructions on extracting updated documentation from the ESLint repository.
Key Differences Between Versions
ESLint 9.x (Flat Config)
- New flat config format (eslint.config.js)
- Simplified configuration structure
- Better TypeScript support
- Improved performance
ESLint 8.x (Legacy)
- Uses .eslintrc.* files (deprecated in v9+)
- Different plugin loading mechanism
- Legacy config format
Migration: See references/use/configure/migration-guide.md for migrating from v8 to v9.
Working with This Skill
This skill provides:
- Comprehensive rule reference - All 300+ ESLint rules with examples
- Configuration patterns - Flat config examples and best practices
- Integration guides - Editor, build system, and CI/CD integration
- Troubleshooting - Common errors and solutions
- Migration guides - Version upgrade assistance
- Extension patterns - Custom rules, plugins, and parsers
For specific rule details, configuration options, or integration patterns, consult the organized reference documentation in references/.
More from ghosttypes/ff-5mp-api-ts
typescript-best-practices
TypeScript best practices and patterns for writing type-safe, maintainable code. Use when working with TypeScript files, configuring tsconfig, defining interfaces/types, implementing error handling, writing generics, or setting up type-safe communication patterns. Includes patterns for discriminated unions, type guards, utility types, and more.
34npm-to-pnpm
Migrate projects from npm to pnpm including lockfile conversion, workspace setup, CI/CD updates, and troubleshooting. Use when converting a single package from npm to pnpm, migrating npm workspaces or monorepos, updating CI/CD pipelines for pnpm, troubleshooting issues after npm to pnpm migration, or converting package-lock.json to pnpm-lock.yaml.
17sub-agent-creator
Interactive sub-agent creation skill for Claude Code. Use when user wants to create a custom subagent or mentions needing a specialized agent for specific tasks. This skill guides the entire subagent creation process including identifier design, system prompt generation, skill/context selection, and writing properly formatted agent files to .claude/agents.
12biome
Comprehensive Biome (biomejs.dev) integration for professional TypeScript/JavaScript development. Use for linting, formatting, code quality, and flawless Biome integration into codebases. Covers installation, configuration, migration from ESLint/Prettier, all linter rules, formatter options, CLI usage, editor integration, monorepo setup, and CI/CD integration. Use when working with Biome tooling, configuring biome.json, setting up linting/formatting, migrating projects, debugging Biome issues, or implementing production-ready Biome workflows.
11vitest
Comprehensive Vitest testing framework skill for writing, configuring, and running tests in JavaScript/TypeScript projects. Use when Claude needs to: set up Vitest in a new or existing project (Vite or non-Vite), write or modify tests using Vitest APIs, configure Vitest for specific scenarios (coverage, browser testing, mocking, etc.), migrate from Jest or older Vitest versions, debug test failures or configuration issues, implement advanced testing patterns (workspace, browser mode, snapshots, mocking).
10github-actions
Comprehensive GitHub Actions workflow authoring skill. Enables Claude to write production-grade CI/CD workflows with latest best practices, syntax, and security patterns. Use when creating or modifying GitHub Actions workflows, designing CI/CD pipelines, configuring workflow triggers/events/schedules, implementing security patterns (secrets, OIDC, attestations), creating custom actions, migrating from other CI systems, troubleshooting failed workflows, or any GitHub Actions automation task. Includes complete reference documentation extracted from official GitHub docs with source URLs for verification.
10