Zum Hauptinhalt springen

Konfigurationsdatei

Inoffizielle Beta-Übersetzung

Diese Seite wurde von PageTurner AI übersetzt (Beta). Nicht offiziell vom Projekt unterstützt. Fehler gefunden? Problem melden →

Sie können Prettier über folgende Methoden konfigurieren (in absteigender Priorität):

  • Einen "prettier"-Schlüssel in Ihrer package.json oder package.yaml-Datei.

  • Eine .prettierrc-Datei im JSON- oder YAML-Format.

  • Eine .prettierrc.json, .prettierrc.yml, .prettierrc.yaml oder .prettierrc.json5-Datei.

  • Eine .prettierrc.js, prettier.config.js, .prettierrc.ts oder prettier.config.ts-Datei, die ein Objekt via export default oder module.exports exportiert (abhängig vom type-Wert in Ihrer package.json).

  • Eine .prettierrc.mjs, prettier.config.mjs, .prettierrc.mts oder prettier.config.mts-Datei, die ein Objekt via export default exportiert.

  • Eine .prettierrc.cjs, prettier.config.cjs, .prettierrc.cts oder prettier.config.cts-Datei, die ein Objekt via module.exports exportiert.

  • Eine .prettierrc.toml-Datei.

Info

Die Unterstützung für TypeScript-Konfigurationsdateien erfordert zusätzliche Einrichtung

Die Konfigurationsdatei wird ausgehend vom Speicherort der zu formatierenden Datei aufgelöst, wobei die Dateistruktur nach oben durchsucht wird, bis eine Konfigurationsdatei gefunden (oder nicht gefunden) wird.

Prettier unterstützt bewusst keine globalen Konfigurationen. Dies stellt sicher, dass das Verhalten von Prettier konsistent bleibt, wenn ein Projekt auf einen anderen Computer kopiert wird. Andernfalls könnte Prettier nicht garantieren, dass alle Teammitglieder dieselben konsistenten Ergebnisse erhalten.

Die verfügbaren Optionen in der Konfigurationsdatei entsprechen den API-Optionen.

TypeScript-Konfigurationsdateien​

TypeScript-Unterstützung erfordert Node.js>=22.6.0. Vor Node.js v24.3.0 ist zusätzlich --experimental-strip-types erforderlich.

node --experimental-strip-types node_modules/prettier/bin/prettier.cjs . --write

oder

NODE_OPTIONS="--experimental-strip-types" prettier . --write

Grundlegende Konfiguration​

JSON:

{
  "trailingComma": "es5",
  "tabWidth": 4,
  "semi": false,
  "singleQuote": true
}

JS (ES Modules):

// prettier.config.js, .prettierrc.js, prettier.config.mjs, or .prettierrc.mjs

/**
 * @see https://prettier.io/docs/configuration
 * @type {import("prettier").Config}
 */
const config = {
  trailingComma: "es5",
  tabWidth: 4,
  semi: false,
  singleQuote: true,
};

export default config;

JS (CommonJS):

// prettier.config.js, .prettierrc.js, prettier.config.cjs, or .prettierrc.cjs

/**
 * @see https://prettier.io/docs/configuration
 * @type {import("prettier").Config}
 */
const config = {
  trailingComma: "es5",
  tabWidth: 4,
  semi: false,
  singleQuote: true,
};

module.exports = config;

TypeScript (ES Modules):

// prettier.config.ts, .prettierrc.ts, prettier.config.mts, or .prettierrc.mts

import { type Config } from "prettier";

const config: Config = {
  trailingComma: "none",
};

export default config;

TypeScript (CommonJS):

// prettier.config.ts, .prettierrc.ts, prettier.config.cts, or .prettierrc.cts

import { type Config } from "prettier";

const config: Config = {
  trailingComma: "none",
};

module.exports = config;

YAML:

# .prettierrc or .prettierrc.yaml
trailingComma: "es5"
tabWidth: 4
semi: false
singleQuote: true

TOML:

# .prettierrc.toml
trailingComma = "es5"
tabWidth = 4
semi = false
singleQuote = true

Konfigurationsüberschreibungen​

Überschreibungen ermöglichen unterschiedliche Konfigurationen für bestimmte Dateierweiterungen, Ordner und spezifische Dateien.

JSON:

{
  "semi": false,
  "overrides": [
    {
      "files": "*.test.js",
      "options": {
        "semi": true
      }
    },
    {
      "files": ["*.html", "legacy/**/*.js"],
      "options": {
        "tabWidth": 4
      }
    }
  ]
}

YAML:

semi: false
overrides:
  - files: "*.test.js"
    options:
      semi: true
  - files:
      - "*.html"
      - "legacy/**/*.js"
    options:
      tabWidth: 4

files ist für jede Überschreibung erforderlich und kann ein String oder String-Array sein. excludeFiles kann optional zum Ausschließen von Dateien angegeben werden und ist ebenfalls ein String oder String-Array.

Festlegen der Parser-Option​

Standardmäßig ermittelt Prettier automatisch den passenden Parser basierend auf der Dateiendung. Kombiniert mit overrides können Sie Prettier beibringen, wie es nicht erkannte Dateien parsen soll.

Um beispielsweise die eigene .prettierrc-Datei von Prettier formatieren zu lassen:

{
  "overrides": [
    {
      "files": ".prettierrc",
      "options": { "parser": "json" }
    }
  ]
}

Sie können auch für .js-Dateien den flow-Parser anstelle des Standardparsers babel verwenden:

{
  "overrides": [
    {
      "files": "*.js",
      "options": {
        "parser": "flow"
      }
    }
  ]
}

Hinweis: Setzen Sie die parser-Option niemals auf der obersten Ebene Ihrer Konfiguration. Verwenden Sie sie ausschließlich innerhalb von overrides. Andernfalls deaktivieren Sie die automatische Parser-Erkennung von Prettier, die auf Dateiendungen basiert. Dies zwingt Prettier dazu, den angegebenen Parser für alle Dateitypen zu verwenden – selbst wenn dies sinnwidrig ist, wie etwa der Versuch, eine CSS-Datei als JavaScript zu parsen.

Konfigurationsschema​

Falls Sie ein JSON-Schema zur Validierung Ihrer Konfiguration benötigen, steht eines hier zur Verfügung: https://www.schemastore.org/prettierrc.json.

EditorConfig​

Wenn eine .editorconfig-Datei in Ihrem Projekt vorhanden ist, parst Prettier diese und wandelt ihre Eigenschaften in die entsprechende Prettier-Konfiguration um. Diese Konfiguration wird durch .prettierrc etc. überschrieben.

Hinweis

Anders als in der EditorConfig-Spezifikation wird die Suche nach der .editorconfig-Datei im Projektstammverzeichnis beendet und nicht weiter fortgesetzt.

Hier finden Sie eine annotierte Beschreibung, wie verschiedene Eigenschaften auf Prettiers Verhalten abgebildet werden:

# Stop the editor from looking for .editorconfig files in the parent directories
# root = true

[*]
# Non-configurable Prettier behaviors
charset = utf-8
insert_final_newline = true
# Caveat: Prettier won’t trim trailing whitespace inside template strings, but your editor might.
# trim_trailing_whitespace = true

# Configurable Prettier behaviors
# (change these if your Prettier config differs)
end_of_line = lf
indent_style = space
indent_size = 2
max_line_length = 80

Hier ist eine kopierfertige .editorconfig-Datei für die Verwendung mit Standardoptionen:

[*]
charset = utf-8
insert_final_newline = true
end_of_line = lf
indent_style = space
indent_size = 2
max_line_length = 80