Zum Inhalt springen
Projekt besprechen
Alle Technologien

Prettier der Standard-Formatter für einheitlichen Code

Prettier formatiert Code automatisch nach festen Regeln: Einrückung, Zeilenlänge, Anführungszeichen und Umbrüche sehen überall gleich aus, unabhängig davon, wer geschrieben hat. Das beendet Formatierungs-Diskussionen im Team und hält Diffs sauber, weil nur echte Änderungen auftauchen, kein Stil-Rauschen. Prettier kümmert sich bewusst nur um Formatierung, nicht um Code-Qualität, deshalb kombinieren wir es meist mit ESLint, das die inhaltliche Prüfung übernimmt. Wer beides in einem schnellen Werkzeug bündeln will, für den ist Biome die Alternative. Als White-Label-Partner richten wir Prettier über Format-on-Save und einen Pre-Commit-Hook ein und übergeben das dokumentierte Setup diskret an Ihre Agentur.

Code-Formatierung Systemebene
Die Rolle von Prettier im Projekt, schematisch dargestellt.

01 / Einsatz

Wofür sich Prettier eignet

  • Einheitliche Formatierung im gesamten Projekt
  • Format-on-Save direkt im Editor
  • Saubere Diffs ohne Stil-Rauschen
  • Schluss mit Formatierungs-Diskussionen im Team
  • Automatische Formatierung im Pre-Commit-Hook

02 / Einblick

Prettier in der Praxis

.prettierrc
{
  "semi": false,
  "singleQuote": true,
  "trailingComma": "all",
  "printWidth": 100,
  "tabWidth": 2,
  "plugins": ["prettier-plugin-tailwindcss"]
}

03 / Vorgehen

So arbeiten wir mit Prettier

  1. Prettier-Konfiguration nach Projekt-Konventionen festlegen

  2. Abgrenzung zu ESLint: Formatierung und Code-Qualität trennen

  3. Editor-Integration für Format-on-Save einrichten

  4. Pre-Commit-Hook, damit nur formatierter Code eingecheckt wird

  5. Optional einmalige Formatierung der bestehenden Codebase

  6. Übergabe: Konfiguration und Editor-Setup dokumentiert

Das liefern wir bei Prettier

  • Konfiguriertes Prettier-Setup
  • Sauberes Zusammenspiel mit ESLint
  • Editor-Integration (Format-on-Save)
  • Pre-Commit-Hook für automatische Formatierung
  • Übergabe-Doku: Konfiguration und Konventionen

Häufige Fragen zu Prettier

Prettier oder Biome: Was empfehlen Sie?
Prettier ist der De-facto-Standard für Formatierung und lässt sich fein abstimmen, braucht aber für Linting zusätzlich ESLint. Biome formatiert und lintet in einem schnellen Werkzeug mit einer Konfiguration. Faustregel: Prettier plus ESLint, wenn das etablierte Setup und feine Kontrolle zählen; Biome, wenn ein schlankes, schnelles All-in-one gewünscht ist. Wir richten das ein, was zum Team passt.
Streiten sich Prettier und ESLint nicht?
Nur bei falscher Konfiguration. Wir trennen die Zuständigkeiten sauber: Prettier übernimmt die Formatierung, ESLint die Code-Qualität, und Formatierungs-Regeln in ESLint werden deaktiviert, damit sich beide nicht widersprechen. So ergänzen sie sich, statt sich gegenseitig zu überschreiben.
Können Sie Prettier in ein bestehendes Projekt einführen?
Ja. Wir formatieren die Codebase einmalig durch und binden Prettier dann in Editor und Pre-Commit-Hook ein. Den großen Erst-Commit halten wir bewusst getrennt von inhaltlichen Änderungen, damit die Git-Historie nachvollziehbar bleibt.
Verändert Prettier die Funktion meines Codes?
Nein. Prettier ändert ausschließlich die Formatierung, nicht die Logik. Der Code tut nach der Formatierung exakt dasselbe wie vorher, er sieht nur einheitlich aus. Das macht die Einführung risikoarm.

Passt zu Prettier

Passende Leistungen

Prettier für Ihr Projekt?

Beschreiben Sie uns Ihre Anforderungen. Wir besprechen, wie die Technologie in Ihr Projekt und Ihre vorhandene Infrastruktur passt.

Projekt besprechen