HTML-input

Pug-output

Hvad er en HTML til Pug Konverter?

En HTML til Pug konverter omdanner standard HTML-markering til Pug-skabelonsyntaks. Pug erstatter omstaendig HTML med en ren, indrykning-baseret syntaks.

For eksempel: <div class="hero"><p>Hej</p></div> bliver div.hero p Hej. Pug bruges ofte med Express.js.

Sadan konverterer du HTML til Pug

Folg disse tre trin for at transformere HTML til Pug-syntaks.

Indsaet eller upload HTML

Indsaet din HTML i venstre panel, eller klik pa Upload.

Se Pug-output

Det hoejre panel viser Pug-skabelonen med .klasse, #id og korrekt indrykning.

Kopier eller download

Klik pa Kopier eller Download for at gemme som .pug.

Hvornaar man bruger denne konverter

Migrere Express.js-projekter

Konverter eksisterende HTML-skabeloner til brug med Pug som view-motor i Express.

Rydde op i omstaendig HTML

Pug-syntaksen fjerner alle lukkende tags og reducerer filen med 30-50%.

Laere Pug-syntaks

Konverter HTML, du kender, og se straks Pug-aekvivalenten.

Generere prototypeskabeloner

Konverter HTML-output fra designvaerktojter til Pug-skabeloner til Node.js.

Hyppige sporgsmal

Hvad er Pug-syntaks?

Pug bruger indrykning i stedet for lukkende tags. Klasser: div.minKlasse. ID'er: div#mitId. Attributter i parenteser: a(href="/").

Haandterer det indlejrede elementer?

Ja. Konverteren gaar igennem DOM og placerer hvert element paa det korrekte indryskningsniveau.

Hvordan behandles attributter?

Alle attributter undtagen klasse og id placeres i parenteser: input(type="text").

Bevares tekstindhold?

Ja. Tekstnoder udskrives som inline-indhold, nar der ikke er borneelementer.

Gemmes min HTML?

Nej. Alt sker i din browser.

Relaterede vaerktojter

Flere vaerktojter til at arbejde med HTML: