Archivo de configuración

Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

Puedes configurar Prettier mediante (en orden de precedencia):

Una clave "prettier" en tu archivo package.json o package.yaml.
Un archivo .prettierrc escrito en JSON o YAML.
Un archivo .prettierrc.json, .prettierrc.yml, .prettierrc.yaml, o .prettierrc.json5.
Un archivo .prettierrc.js, prettier.config.js, .prettierrc.ts, o prettier.config.ts que exporte un objeto usando export default o module.exports (depende del valor type en tu package.json).
Un archivo .prettierrc.mjs, prettier.config.mjs, .prettierrc.mts, o prettier.config.mts que exporte un objeto usando export default.
Un archivo .prettierrc.cjs, prettier.config.cjs, .prettierrc.cts, o prettier.config.cts que exporte un objeto usando module.exports.
Un archivo .prettierrc.toml.

información

El soporte para archivos de configuración TypeScript requiere configuración adicional

El archivo de configuración se resolverá comenzando desde la ubicación del archivo que se está formateando, buscando hacia arriba en el árbol de archivos hasta encontrar (o no) un archivo de configuración.

Prettier intencionalmente no admite ningún tipo de configuración global. Esto asegura que cuando un proyecto se copia a otra computadora, el comportamiento de Prettier permanece igual. De lo contrario, Prettier no podría garantizar que todos en un equipo obtengan resultados consistentes.

Las opciones que puedes usar en el archivo de configuración son las mismas que las opciones de la API.

Archivos de configuración TypeScript

El soporte para TypeScript requiere Node.js>=22.6.0, y --experimental-strip-types es necesario antes de Node.js v24.3.0 para ejecutar Node.js.

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

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

Configuración básica

JSON:

.prettierrc.json or .prettierrc
{
  "trailingComma": "es5",
  "tabWidth": 4,
  "semi": false,
  "singleQuote": true
}

JS (Módulos ES):

prettier.config.mjs, .prettierrc.mjs, prettier.config.js, or .prettierrc.js
/**
 * @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.cjs, .prettierrc.cjs, prettier.config.js, or .prettierrc.js
/**
 * @see https://prettier.io/docs/configuration
 * @type {import("prettier").Config}
 */
const config = {
  trailingComma: "es5",
  tabWidth: 4,
  semi: false,
  singleQuote: true,
};

module.exports = config;

TypeScript (Módulos ES):

prettier.config.mts, .prettierrc.mts, prettier.config.ts, or .prettierrc.ts
import { type Config } from "prettier";

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

export default config;

TypeScript (CommonJS):

prettier.config.cts, .prettierrc.cts, prettier.config.ts, or .prettierrc.ts
import { type Config } from "prettier";

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

module.exports = config;

YAML:

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

TOML:

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

Sobrescritura de configuración

Las sobrescrituras permiten tener diferentes configuraciones para ciertas extensiones de archivo, carpetas y archivos específicos.

JSON:

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

YAML:

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

files es requerido para cada sobrescritura y puede ser un string o array de strings. excludeFiles puede proporcionarse opcionalmente para excluir archivos de una regla dada y también puede ser un string o array de strings.

Configurando la opción parser

Por defecto, Prettier infiere automáticamente qué parser usar según la extensión del archivo de entrada. Combinado con overrides puedes enseñar a Prettier cómo analizar archivos que no reconoce.

Por ejemplo, para que Prettier formatee su propio archivo .prettierrc, puedes hacer:

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

También puedes cambiar al parser flow en lugar del predeterminado babel para archivos .js:

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

Nota: Nunca coloques la opción parser en el nivel superior de tu configuración. Solo úsala dentro de overrides. De lo contrario, deshabilitarás la inferencia automática de analizador basada en extensiones de archivo de Prettier. Esto fuerza a Prettier a usar el analizador que especificaste para todos los tipos de archivos, incluso cuando no tiene sentido, como intentar analizar un archivo CSS como JavaScript.

Esquema de configuración

Si deseas un esquema JSON para validar tu configuración, hay uno disponible aquí: https://www.schemastore.org/prettierrc.json.

EditorConfig

Si existe un archivo .editorconfig en tu proyecto, Prettier lo analizará y convertirá sus propiedades a la configuración correspondiente de Prettier. Esta configuración será sobrescrita por .prettierrc, etc.

nota

A diferencia de la especificación de EditorConfig, la búsqueda del archivo .editorconfig se detendrá en la raíz del proyecto y no continuará más allá.

Aquí tienes una descripción detallada de cómo se mapean las diferentes propiedades al comportamiento de Prettier:

.editorconfig
# 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

Aquí tienes un archivo .editorconfig listo para copiar y pegar si usas las opciones predeterminadas:

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

Archivos de configuración TypeScript​

Configuración básica​

Sobrescritura de configuración​

Configurando la opción parser​

Esquema de configuración​

EditorConfig​