| name | code-quality-lint |
| description | This skill should be used when the user asks to "set up eslint", "configure prettier", "add biome", "set up ruff", "configure lint-staged", "add formatter", "configure linter", or needs reference for linter/formatter/lint-staged configuration in their project. |
| version | 1.1.0 |
Linter, Formatter, and lint-staged Reference
Configuration reference for code quality tools across ecosystems. Use this skill when you need to set up, modify, or troubleshoot specific linting and formatting tools.
Ecosystem Guide
JavaScript / TypeScript
Biome (Recommended for New Projects)
Biome is a single tool that replaces ESLint + Prettier -- faster, zero-config defaults, consistent formatting.
npm add -D @biomejs/biome
npx biome init
biome.json:
{
"$schema": "https://biomejs.dev/schemas/2.0.0/schema.json",
"organizeImports": {
"enabled": true
},
"linter": {
"enabled": true,
"rules": {
"recommended": true
}
},
"formatter": {
"enabled": true,
"indentStyle": "space",
"indentWidth": 2
}
}
lint-staged config:
{
"*.{js,jsx,ts,tsx,json,jsonc,css}": ["biome check --write --no-errors-on-unmatched"]
}
When to choose Biome over ESLint + Prettier:
- New projects without existing ESLint config
- Want simpler toolchain (one tool, one config)
- Performance-sensitive CI (Biome is significantly faster)
ESLint 9 (Flat Config)
ESLint 9 uses flat config (eslint.config.js) instead of the legacy .eslintrc.* format.
npm add -D eslint @eslint/js typescript-eslint
eslint.config.js:
import js from '@eslint/js';
import tseslint from 'typescript-eslint';
export default tseslint.config(
js.configs.recommended,
...tseslint.configs.recommended,
{
ignores: ['dist/', 'node_modules/', '.next/']
}
);
lint-staged config:
{
"*.{js,jsx,ts,tsx}": ["eslint --fix"]
}
Prettier
npm add -D prettier
.prettierrc:
{
"semi": true,
"singleQuote": true,
"trailingComma": "es5",
"tabWidth": 2,
"printWidth": 100
}
lint-staged config (with ESLint):
{
"*.{js,jsx,ts,tsx}": ["eslint --fix", "prettier --write"],
"*.{json,md,yml,yaml,css}": ["prettier --write"]
}
lint-staged Configuration
lint-staged runs linters/formatters only on staged files, making pre-commit hooks fast regardless of project size.
Installation
npm add -D lint-staged
Configuration Examples
Minimal (Biome):
{
"*.{js,jsx,ts,tsx,json}": ["biome check --write --no-errors-on-unmatched"]
}
ESLint + Prettier:
{
"*.{js,jsx,ts,tsx}": ["eslint --fix", "prettier --write"],
"*.{json,md,yml,yaml,css,html}": ["prettier --write"]
}
TypeScript-aware (with type checking on staged files):
{
"*.{ts,tsx}": ["eslint --fix", "prettier --write"],
"*.{js,jsx}": ["eslint --fix", "prettier --write"]
}
Note: Running tsc in lint-staged is usually not recommended because TypeScript type checking requires the full project context, not just staged files. Put tsc --noEmit in your pre-push hook instead.
For advanced patterns, monorepo config, and non-JS ecosystems: see references/lint-staged-advanced.md
Reference Files