Convertitore HTML in Pug
Converti il markup HTML in sintassi template Pug pulita
Input HTML
Output Pug
Cos'e un convertitore HTML in Pug?
Un convertitore HTML in Pug trasforma il markup HTML standard in sintassi template Pug. Pug sostituisce l'HTML verboso con una sintassi pulita basata su spazi bianchi.
Ad esempio, <div class="hero"><p>Ciao</p></div> diventa div.hero
p Ciao. Pug e ampiamente usato con Express.js.
Come convertire HTML in Pug
Segui questi tre passaggi per trasformare HTML in sintassi Pug.
Incolla o carica HTML
Incolla il tuo HTML nel pannello sinistro o clicca su Carica.
Vedi l'output Pug
Il pannello destro mostra il template Pug con notazione .classe, #id e indentazione corretta.
Copia o scarica
Clicca su Copia o Scarica per salvare come .pug.
Quando usare questo convertitore
Migrare progetti Express.js
Converti template HTML esistenti per usare Pug come motore di view in Express.
Pulire HTML verboso
La sintassi Pug rimuove tutti i tag di chiusura, riducendo il file del 30-50%.
Imparare la sintassi Pug
Converti HTML che conosci e vedi subito l'equivalente Pug.
Generazione di template prototipo
Converti output HTML di strumenti di design in template Pug per Node.js.
Domande frequenti
Cos'e la sintassi Pug?
Pug usa l'indentazione invece dei tag di chiusura. Classi: div.miaClasse. ID: div#mioId. Attributi tra parentesi: a(href="/").
Gestisce gli elementi annidati?
Si. Il convertitore percorre il DOM e colloca ogni elemento al corretto livello di indentazione.
Come vengono gestiti gli attributi?
Tutti gli attributi tranne classe e id vanno tra parentesi: input(type="text").
Il contenuto testo viene preservato?
Si. I nodi di testo vengono emessi come contenuto inline quando non ci sono elementi figli.
I miei dati vengono memorizzati?
No. Tutto avviene nel tuo browser.
Strumenti correlati
Altri strumenti per lavorare con HTML: