skills.rest
jvsandhu
jvsandhuCOMMUNITY
Explore all skills by this author →
GitHub

code_formatter

Configures Prettier and ESLint to automate code formatting and style consistency.

Updated Jan 14, 2026
Search Tags:#code style#eslint#code formatting#prettier#ci#lint-staged#husky
One-click install
npx skills add https://github.com/jvsandhu/agentic-skills --skill code-formatter-jvsandhu
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: code_formatter
Source: https://github.com/jvsandhu/agentic-skills/tree/main/skills/code_formatter
Command: npx skills add https://github.com/jvsandhu/agentic-skills --skill code-formatter-jvsandhu

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires prettier, eslint, husky, lint-staged.

What problem does it solve? Inconsistent code style across a team leads to noisy diffs, review friction, and preventable lint errors. This Skill provides ready-to-use Prettier and ESLint configurations, Git hooks, and CI checks so formatting is enforced automatically instead of manually. ## Core Features & Use Cases - Prettier Configuration: Provides a complete .prettierrc setup with commands to format or check single files and entire source trees. - ESLint Integration: Supplies an .eslintrc.js extending TypeScript and React recommended rules, with Prettier conflict resolution. - Pre-commit Automation: Sets up Husky and lint-staged so staged files are linted and formatted before every commit. - Use Case: When starting a new TypeScript/React project, apply this Skill to install the toolchain, add ignore files, and wire CI checks so every commit and pipeline run enforces consistent style. ## Quick Start Set up Prettier and ESLint with Husky pre-commit hooks in my project so all staged files are automatically formatted and linted.

Frequently Asked Questions about code_formatter

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I set up Prettier in a JavaScript project?▼

Install Prettier via npm, add a `.prettierrc` file with options like semi, singleQuote, and printWidth, then run `npx prettier --write` on your source files. Add a `.prettierignore` to exclude node_modules and build output.

How to integrate ESLint with Prettier without conflicts?▼

Add the `prettier` config last in your ESLint `extends` array so it disables ESLint rules that conflict with Prettier formatting. Then run ESLint for code quality and Prettier for formatting as separate steps.

How do I run Prettier and ESLint automatically before commits?▼

Use Husky with lint-staged: initialize Husky, add a pre-commit hook running `npx lint-staged`, and configure lint-staged in package.json to run `eslint --fix` and `prettier --write` on staged files.

Does Prettier work with TypeScript and React files?▼

Yes, Prettier formats ts, tsx, js, jsx, json, css, and markdown files out of the box. Pair it with @typescript-eslint and eslint-plugin-react in ESLint for type-aware linting alongside formatting.

Why does my CI pipeline fail on formatting errors?▼

CI fails when `prettier --check` or `npm run lint` detects unformatted or non-compliant code. Run `npx prettier --write` and `eslint --fix` locally, then commit the corrected files to pass the pipeline.

Related Skills

Explore More Software Engineering Skills→
rnaarlarnaarla

setup-pre-commit

Configure Husky pre-commit hooks with lint-staged and Prettier for JavaScript projects.

Community
Intermediate
hodinhtuankiethodinhtuankiet

ci-cd-and-automation

Automate CI/CD pipeline setup and quality gates in GitHub Actions workflows.

Community
Advanced
outcomeengoutcomeeng
1

standardizing-typescript

Enforce strict TypeScript typing and ESLint rules across production and test code.

Official
Advanced
XantibodyXantibody
1

format

Format code across languages using project-specific tools like prettier or gofmt.

Community
Intermediate