Convertidor de HTML a Pug

Convierte rápidamente código HTML a código Pug. Soporta conversión en el navegador local, con editor de código y funciones de autocompletado.

1025 usos | 5.0 puntuación

Entrada HTML

Salida Pug

Instrucciones de uso

1

Introduce código HTML

Pega o introduce el código HTML que deseas convertir en el cuadro de entrada izquierdo.

2

Ejecuta la conversión

Haz clic en el botón "Convertir a Pug" para transformar el código HTML a formato Pug.

3

Revisa el resultado

Ve el código Pug convertido en el cuadro de salida derecho.

4

Usa el resultado

Copia o descarga el código Pug convertido para usarlo en tu proyecto.

Conocimientos básicos del motor de plantillas Pug

¿Qué es Pug?

Pug (anteriormente conocido como Jade) es un motor de plantillas de alto rendimiento que se compila a HTML y se usa ampliamente en entornos Node.js. Pug proporciona una sintaxis concisa y elegante que permite a los desarrolladores escribir páginas HTML estructuradas con menos código, al tiempo que admite características avanzadas como variables, mixins y condicionales.

Principales ventajas de Pug

Sintaxis concisa, reduce el código redundante

Sintaxis basada en sangría, mejora la legibilidad del código

Soporte para herencia e inclusión de plantillas

Potente soporte para expresiones lógicas

Autoescapado, mejora la seguridad

Integración perfecta con el ecosistema JavaScript

Comparación de sintaxis HTML y Pug

Sintaxis HTML:
<div class="container">
  <h1>Página de bienvenida</h1>
  <p class="description">
    Este es un párrafo de ejemplo
  </p>
  <ul>
    <li>Elemento de lista 1</li>
    <li>Elemento de lista 2</li>
  </ul>
</div>
Sintaxis Pug:
.container
  h1 Página de bienvenida
  p.description
    | Este es un párrafo de ejemplo
  ul
    li Elemento de lista 1
    li Elemento de lista 2
Anuncio

推荐工具

Herramienta de formateo XML - Herramienta gratuita en línea para embellecer y comprimir código XML

Herramienta gratuita en línea de formateo XML que admite funciones como embellecimiento, compresión, validación de código XML, etc., para que su código XML sea más estándar y legible. Proporciona vista previa de formateo en tiempo real y admite múltiples opciones de formato XML.

XML a JSON - Herramienta de conversión en línea gratuita

La herramienta XML a JSON puede analizar y convertir cadenas en formato XML y JSON, y formatear las cadenas convertidas.

Herramienta en línea para formatear y comprimir JavaScript - Embellecer, optimizar y ofuscar código JS

Una potente herramienta en línea para formatear y comprimir código JavaScript (JS). Admite sangría personalizada (tabulaciones o espacios), plegado/desplegado de código, ajuste de línea automático, embellecimiento con un solo clic y compresión/ofuscación eficiente de scripts JS, ayudando a los desarrolladores a mejorar la legibilidad del código, reducir el tamaño del archivo y optimizar el rendimiento del sitio web.

Conversor de YAML a JSON - Caja de herramientas en línea gratuita

Herramienta en línea de conversión mutua entre formatos YAML (YML) y JSON, compatible con la conversión mutua entre datos YAML y JSON, y también compatible con la validación de si los datos de formato YAML y JSON ingresados son correctos.

Formateo YAML - Herramienta YAML en línea gratuita

Herramienta gratuita en línea para formatear y embellecer YAML, compatible con ajuste automático de sangría, resaltado de sintaxis y eliminación de espacios extra, haciendo que tu código YAML sea claro y fácil de leer. ¡Sin instalación necesaria, formateo con un solo clic para mejorar la legibilidad y la eficiencia de mantenimiento de los archivos YAML!