Wejscie HTML

Wyjscie Pug

Co to jest konwerter HTML na Pug?

Konwerter HTML na Pug przeksztalca standardowy znacznik HTML w skladnie szablonu Pug. Pug zastepuje rozwlekly HTML czystą skladnia opartą na bialych znakach.

Na przyklad <div class="hero"><p>Czesc</p></div> staje sie div.hero p Czesc. Pug jest szeroko uzywany z Express.js.

Jak konwertowac HTML na Pug

Wykonaj te trzy kroki, aby przekonwertowac HTML na skladnie Pug.

Wklej lub przeslij HTML

Wklej HTML do lewego panelu lub kliknij Przeslij.

Wyswietl wyjscie Pug

Prawy panel pokazuje szablon Pug z notacja .klasa, #id i poprawnym wciecia.

Kopiuj lub pobierz

Kliknij Kopiuj lub Pobierz, aby zapisac jako .pug.

Kiedy uzywac tego konwertera

Migracja projektow Express.js

Konwertuj istniejace szablony HTML do uzytku z Pug jako silnikiem widokow w Express.

Czyszczenie rozwleklego HTML

Skladnia Pug usuwa wszystkie tagi zamykajace i zmniejsza plik o 30-50%.

Nauka skladni Pug

Konwertuj HTML, ktory znasz, i od razu zobaczysz odpowiednik Pug.

Generowanie szablonow prototypow

Konwertuj wyjscia HTML z narzedzi projektowych na szablony Pug dla Node.js.

Czesto zadawane pytania

Co to jest skladnia Pug?

Pug uzywa wciecia zamiast tagow zamykajacych. Klasy: div.mojaKlasa. ID: div#mojeId. Atrybuty w nawiasach: a(href="/").

Czy obsluguje zagniezdzone elementy?

Tak. Konwerter przechodzi przez DOM i umieszcza kazdy element na odpowiednim poziomie wciecia.

Jak sa traktowane atrybuty?

Wszystkie atrybuty poza klasa i id ida w nawiasach: input(type="text").

Czy zawartosc tekstowa jest zachowana?

Tak. Wezly tekstowe sa wyprowadzane jako tresc inline, gdy nie ma elementow potomnych.

Czy moje dane sa przechowywane?

Nie. Wszystko dzieje sie w Twojej przegladarce.

Powiazane narzedzia

Wiecej narzedzi do pracy z HTML: