Formateador JavaScript - Herramienta online gratuita

Características

Alternar entre embellecer y minificar

Sangrado a medida

Resaltado de sintaxis

Cómo Usar

1. Pega JavaScript en el cuadro de entrada a la izquierda.

2. Haz clic en Formatear para embellecer, o en Minificar para comprimir.

3. Copia la salida formateada.

Sobre esta herramienta

Los scripts minificados, el código pegado desde un chat o un bundle abierto en el navegador son difíciles de leer en una sola línea. Este formateador vuelve a sangrar JavaScript según llaves, corchetes y paréntesis, coloca cada sentencia en su propia línea y mantiene intactas las cadenas y los comentarios, de modo que la estructura de funciones y objetos vuelve a verse. Elige dos espacios, cuatro espacios o tabulaciones. Minificar va en sentido contrario y quita comentarios y espacios sobrantes para obtener una copia compacta. Es un formateador ligero que se ejecuta al instante en tu navegador, no un compilador completo, así que es ideal para leer y ordenar código; para un formato coherente en todo un proyecto, usa Prettier o el formateador de tu editor.

Preguntas Frecuentes

¿Puede devolver código ofuscado o minificado a su forma original?

Formatear recupera la sangría y los saltos de línea, lo que hace legible el código minificado, pero los nombres de variables acortados como a, b o e no pueden volver a sus nombres originales. Para eso hacen falta los source maps.

¿Admite TypeScript o JSX?

El TypeScript y el JSX sencillos suelen formatearse de forma aceptable porque la sangría sigue llaves y corchetes, pero las anotaciones de tipo y las etiquetas JSX no se analizan de forma especial. Usa Prettier para formatear esos lenguajes con fiabilidad.

¿Es seguro usar el resultado minificado en producción?

Quita comentarios y espacios, pero no renombra variables ni elimina código muerto como los minificadores dedicados, por ejemplo Terser o esbuild. Para compilaciones de producción, usa el minificador de tu bundler, que además genera source maps.

¿Formatear cambiará cómo se ejecuta mi código?

El formateador solo cambia espacios y saltos de línea. El principal riesgo es el código que depende de la inserción automática de punto y coma entre líneas; ejecuta siempre las pruebas sobre el código formateado antes de hacer commit.

¿Por qué el resultado se ve raro cerca de las expresiones regulares?

Un literal de expresión regular como /[a-z]+/ puede parecer una división para un formateador ligero. Si una línea con una expresión regular compleja se divide de forma extraña, corrígela a mano o usa un formateador basado en un analizador completo.