Inicio › Herramientas para desarrolladores › Generador de EditorConfig

Generador de EditorConfig

Crea un archivo .editorconfig que mantenga coherentes la sangría, los finales de línea y los espacios en blanco en todos los editores que usa tu equipo. Empieza con un preset de lenguaje, ajusta cada patrón de archivo y comprueba qué reglas se aplican a cualquier ruta antes de hacer commit.

Última actualización:

Secciones

Añadido rápido:

.editorconfig

Guárdalo como .editorconfig (con el punto inicial) en la raíz de tu proyecto. Si tu navegador quita el punto al descargarlo, cambia el nombre del archivo.

Publicidad
Publicidad

Cómo usar Generador de EditorConfig

  1. Elige un preset para tu lenguaje principal y haz clic en Cargar preset, o importa un .editorconfig existente.
  2. Edita las secciones: cambia el patrón de archivo entre corchetes y elige valores para cada propiedad. Deja una propiedad en (sin definir) para mantener el valor predeterminado del editor.
  3. Añade secciones para archivos especiales con los botones de añadido rápido, por ejemplo Makefiles que requieren tabulaciones o Markdown que conserva los espacios finales.
  4. Prueba una ruta como src/app.ts para ver las secciones que coinciden y la configuración que usará el editor.
  5. Copia o descarga el archivo y guárdalo como .editorconfig en la raíz de tu proyecto.

Referencia de propiedades de EditorConfig

PropiedadValoresQué controla
roottrueSolo al principio del archivo (fuera de cualquier sección): deja de buscar archivos .editorconfig en las carpetas superiores.
indent_stylespace, tabSi la tecla Tab y la sangría automática insertan espacios o caracteres de tabulación.
indent_sizenúmero entero, tabColumnas por nivel de sangría.
tab_widthnúmero enteroAncho con que se muestra un carácter de tabulación; por defecto, igual a indent_size.
end_of_linelf, crlf, crSalto de línea que se escribe al guardar: LF para Unix/macOS, CRLF para Windows.
charsetutf-8, utf-8-bom, latin1, utf-16be, utf-16leCodificación del archivo. Usa utf-8 salvo que una herramienta necesite BOM.
trim_trailing_whitespacetrue, falseElimina los espacios al final de las líneas al guardar.
insert_final_newlinetrue, falseAsegura que el archivo termine con un salto de línea.
max_line_lengthnúmero entero, offColumna guía o de ajuste; solo la admiten algunos editores.

Cualquier propiedad también puede definirse como unset, lo que elimina un valor heredado de una sección anterior para que el editor vuelva a su propio valor predeterminado. Los nombres y valores de las propiedades no distinguen mayúsculas de minúsculas.

Guía rápida de patrones glob

PatrónCoincide con
*Cualquier cadena excepto /; [*] por sí solo coincide con todos los archivos
**Cualquier cadena, incluida /, así que src/**.ts coincide con archivos TypeScript a cualquier profundidad dentro de src
?Exactamente un carácter (no /)
[abc], [!abc]Un carácter del conjunto, o que no esté en el conjunto
{js,ts,tsx}Cualquiera de las alternativas separadas por comas, p. ej. *.{js,ts,tsx}
{1..5}Cualquier número entero de 1 a 5, p. ej. chapter{1..5}.md

Combina EditorConfig con un formateador para lograr total coherencia: el Generador de configuración de Prettier crea un .prettierrc a juego, y Prettier lee indent_style, indent_size/tab_width, max_line_length y end_of_line del .editorconfig cuando no están definidos en su propia configuración.

Preguntas frecuentes

¿Qué es un archivo .editorconfig?

Es un pequeño archivo de texto de estilo INI que indica a los editores de código cómo dar formato a los archivos de un proyecto: espacios o tabulaciones, ancho de sangría, finales de línea, juego de caracteres y recorte de espacios. Muchos editores lo leen de forma nativa (IDE de JetBrains, Visual Studio, Vim, Neovim, el editor web de GitHub) y otros, como VS Code, necesitan la extensión EditorConfig.

¿Dónde pongo el archivo .editorconfig?

Guárdalo en la carpeta raíz de tu repositorio y haz commit. Los editores buscan .editorconfig en la carpeta del archivo y en cada carpeta superior; root = true en el archivo superior detiene esa búsqueda para que se ignore la configuración de fuera del proyecto.

¿Cómo funcionan las secciones y los patrones?

Cada encabezado [sección] es un patrón de archivo. Las secciones posteriores sobrescriben a las anteriores en las propiedades que definen, así que pon primero los valores predeterminados de [*] y después los patrones específicos. Un patrón sin barra, como *.md, coincide con archivos de cualquier carpeta; un patrón con barra, como lib/**.js, es relativo a la carpeta que contiene .editorconfig.

¿Qué diferencia hay entre indent_size y tab_width?

indent_size es cuántas columnas usa un nivel de sangría. tab_width es el ancho con que se muestra un carácter de tabulación. Si sangras con espacios, normalmente solo defines indent_size; tab_width toma por defecto el mismo valor. Definir indent_size = tab significa que una sangría equivale a una tabulación de tab_width columnas.

¿EditorConfig reformatea mis archivos existentes?

No. Solo cambia cómo se comportan los editores al escribir y guardar: nueva sangría, los finales de línea que se escriben, recortar los espacios finales al guardar, etc. Los archivos existentes conservan su formato hasta que se editan o se pasan por un formateador como Prettier.

¿max_line_length funciona en todas partes?

No. max_line_length es una propiedad específica de dominio que algunos editores respetan (IDE de JetBrains, Vim con el plugin, Emacs) mientras que otros la ignoran. Formateadores como Prettier la leen como printWidth cuando no hay otra configuración.

¿Se sube algo?

No. El archivo se genera en tu navegador. Tu última configuración solo se guarda en el almacenamiento local de este navegador para que siga ahí cuando vuelvas.

¿Se prueban todas las herramientas de FreeToolCabin para comprobar su calidad y precisión?

Sí. Cada herramienta del sitio pasa pruebas automáticas en navegadores reales para comprobar que el resultado es correcto y que no hay errores. Si encuentras un fallo o tienes una sugerencia, escríbenos a [email protected] y lo revisaremos.

Herramientas relacionadas

Ver todas las de Entornos de prueba de código →