Volver al blog

Prettier: formateo de código consistente en equipo

·1 min de lectura

¿Qué es Prettier?

Prettier es un formateador de código opinado. Analiza tu código y lo reescribe con reglas de formato consistentes. Elimina las discusiones sobre estilo en el equipo: no hay configuración infinita, solo funciona.

Instalación

npm install --save-dev prettier

Configuración mínima

{
  "semi": true,
  "singleQuote": true,
  "tabWidth": 2,
  "trailingComma": "all",
  "printWidth": 100
}

Integración con ESLint

Usa eslint-config-prettier para desactivar reglas de ESLint que conflictúan con Prettier. Así ESLint se encarga de la lógica y Prettier del formato.

npm install --save-dev eslint-config-prettier
{
  "extends": ["eslint:recommended", "prettier"]
}

Formateo automático con Husky

npm install --save-dev lint-staged
{
  "lint-staged": {
    "*.{js,ts,tsx,json,css,md}": ["prettier --write", "eslint --fix"]
  }
}

Prettier en CI

Añade un step en CI que verifique el formato:

npx prettier --check .

Beneficios

  • No más discusiones sobre puntos y comas.
  • Código uniforme en todo el proyecto.
  • Los PRs muestran solo cambios relevantes.
  • Los nuevos miembros se adaptan rápido.

¿Quieres formateo consistente en tu equipo? En Vynta configuramos herramientas de calidad de código.

Artículos relacionados

¿Tienes un proyecto en mente?

Hablemos