home / skills / ehtbanton / claudeskillsrepo / prettier-config-generator

prettier-config-generator skill

safe

This skill generates a complete Prettier configuration file tailored to your project with consistent formatting across languages.

npx playbooks add skill ehtbanton/claudeskillsrepo --skill prettier-config-generator

Review the files below or copy the command above to add this skill to your agents.

Files (2)

SKILL.md

1.0 KB

---
name: prettier-config-generator
description: Generate Prettier configuration files for consistent code formatting across JavaScript, TypeScript, CSS, and other file types. Triggers on "create prettier config", "generate prettier configuration", "prettier setup", "code formatting config".
---

# Prettier Config Generator

Generate Prettier configuration files for consistent code formatting.

## Output Requirements

**File Output:** `.prettierrc`, `.prettierrc.js`, or `prettier.config.js`
**Format:** Valid Prettier configuration
**Standards:** Prettier 3.x

## When Invoked

Immediately generate a complete Prettier configuration with formatting rules for the project type.

## Configuration Template

```json
{
  "semi": true,
  "singleQuote": true,
  "tabWidth": 2,
  "trailingComma": "es5",
  "printWidth": 100,
  "bracketSpacing": true,
  "arrowParens": "avoid"
}
```

## Example Invocations

**Prompt:** "Create prettier config for TypeScript project"
**Output:** Complete `.prettierrc` with TypeScript-friendly settings.

Overview

This skill generates complete Prettier configuration files to enforce consistent code formatting across JavaScript, TypeScript, CSS, and other file types. It outputs ready-to-use files (.prettierrc, .prettierrc.js, or prettier.config.js) tailored for Prettier 3.x and typical project needs. Use the triggers like "create prettier config", "generate prettier configuration", or "prettier setup" to run it.

How this skill works

When invoked, the skill asks (or infers) project details such as language (JavaScript/TypeScript), target file types, and preferred style rules, then produces a validated Prettier configuration file. It follows Prettier 3.x standards and can emit JSON or JavaScript config files with sensible defaults (semi, singleQuote, tabWidth, trailingComma, printWidth, bracketSpacing, arrowParens). The generated file is ready to drop into the project root and integrate with editors, CI, and git hooks.

When to use it

Setting up consistent formatting for a new JavaScript or TypeScript project
Standardizing formatting across a monorepo or multiple packages
Adding Prettier to projects that include CSS, JSON, Markdown, or other file types
Migrating from older Prettier versions or from mixed formatting rules
Creating a baseline config before integrating with ESLint or editor extensions

Best practices

Choose one config file at the repository root (.prettierrc or prettier.config.js) to avoid conflicts
Match Prettier version in package.json to the config expectations (this skill targets Prettier 3.x)
Combine Prettier with ESLint using eslint-plugin-prettier or eslint-config-prettier to avoid overlapping rules
Add a format script (e.g., "format": "prettier --write .") and run it in CI or pre-commit hooks
Pin formatting rules that matter for your team (printWidth, trailingComma) and keep other settings minimal

Example use cases

Create a TypeScript-friendly .prettierrc that prefers single quotes, 2-space tabs, and avoids arrow parens
Generate a prettier.config.js for a monorepo where different packages share the same formatting
Produce a config including CSS and Markdown formatting rules for a full-stack project
Convert an existing project to Prettier 3.x with updated defaults and a CI format check
Add a default .prettierrc to a library package to ensure consumers see consistent style

FAQ

Which file should I choose: .prettierrc or prettier.config.js?

Use .prettierrc for simple JSON configs and prettier.config.js if you need comments or dynamic logic. Both are supported by Prettier.

Will the generated config work with Prettier 3.x?

Yes. The skill generates settings targeted at Prettier 3.x; verify the installed Prettier version in package.json to avoid mismatches.