HTML-invoer

Pug-uitvoer

Wat is een HTML naar Pug Converter?

Een HTML naar Pug converter transformeert standaard HTML-opmaak naar Pug-templatesyntaxis. Pug vervangt uitgebreide HTML door een schone, spatie-gebaseerde syntaxis.

Bijvoorbeeld: <div class="hero"><p>Hallo</p></div> wordt div.hero p Hallo. Pug wordt veel gebruikt met Express.js.

Hoe HTML naar Pug converteren

Volg deze drie stappen om HTML te transformeren naar Pug-syntaxis.

1

HTML plakken of uploaden

Plak uw HTML in het linkerpaneel of klik op Uploaden.

2

Pug-uitvoer bekijken

Het rechterpaneel toont het Pug-template met .klasse, #id en juiste inspringing.

3

Kopieren of downloaden

Klik op Kopieren of Downloaden om op te slaan als .pug.

Wanneer deze converter gebruiken

Express.js-projecten migreren

Converteer bestaande HTML-templates voor gebruik met Pug als view-engine in Express.

Uitgebreide HTML opschonen

De Pug-syntaxis verwijdert alle sluitende tags en verkleint het bestand met 30-50%.

Pug-syntaxis leren

Converteer HTML die u al kent en zie direct het Pug-equivalent.

Prototype template generatie

Converteer HTML-uitvoer van designtools naar Pug-templates voor Node.js.

Veelgestelde vragen

Wat is Pug-syntaxis?

Pug gebruikt inspringing in plaats van sluitende tags. Klassen: div.mijnKlasse. ID's: div#mijnId. Attributen tussen haakjes: a(href="/").

Verwerkt het geneste elementen?

Ja. De converter doorloopt de DOM en plaatst elk element op het juiste inspringniveau.

Hoe worden attributen behandeld?

Alle attributen behalve klasse en id gaan tussen haakjes: input(type="text").

Wordt tekstinhoud bewaard?

Ja. Tekstknooppunten worden als inline-inhoud uitgevoerd wanneer er geen kindelementen zijn.

Worden mijn gegevens opgeslagen?

Nee. Alles gebeurt in uw browser.

Gerelateerde tools

Meer tools voor het werken met HTML: