HTML'den Pug'a Dönüştürücü
HTML kodunu hızlı bir şekilde Pug koduna dönüştürün. Yerel tarayıcı dönüştürmeyi destekler, kod düzenleyici ve otomatik tamamlama işlevi ile.
HTML Girişi
Pug Çıkışı
Kullanım Talimatları
HTML Kodunu Girin
Soldaki giriş kutusuna dönüştürmek istediğiniz HTML kodunu yapıştırın veya girin.
Dönüştürme Yapın
"Pug'a Dönüştür" düğmesine tıklayarak HTML kodunu Pug formatına dönüştürün.
Sonucu Görüntüleyin
Sağdaki çıkış kutusunda dönüştürülen Pug kodunu görüntüleyin.
Sonucu Kullanın
Dönüştürülen Pug kodunu projenizde kullanmak üzere kopyalayın veya indirin.
Pug Şablon Motoru Temel Bilgileri
Pug Nedir?
Pug (eski adıyla Jade) HTML'e derlenen yüksek performanslı bir şablon motorudur ve Node.js ortamında yaygın olarak kullanılır. Pug, geliştiricilerin yapılandırılmış HTML sayfalarını daha az kodla yazmalarına olanak tanıyan kısa, zarif bir sözdizimi sağlar. Aynı zamanda değişkenler, karışımlar, koşullu kararlar ve diğer gelişmiş özellikleri destekler.
Pug'ın Temel Avantajları
Sözdizimi kısa, fazladan kodu azaltır
Girinti tabanlı sözdizimi, kod okunabilirliğini artırır
Şablon kalıtımı ve dahil etmeyi destekler
Güçlü mantıksal ifade desteği
Otomatik kaçış, güvenliği güçlendirir
JavaScript ekosistemiyle sorunsuz entegrasyon
HTML ve Pug Sözdizimi Karşılaştırması
Hoş Geldiniz Sayfası
Bu örnek bir paragraftır
- Liste Öğesi 1
- Liste Öğesi 2
.container
h1 Hoş Geldiniz Sayfası
p.description
| Bu örnek bir paragraftır
ul
li Liste Öğesi 1
li Liste Öğesi 2
Yaygın Pug Sözdizimi Örnekleri
h1 Başlık Metni
div.container#main
a(href='bağlantı', title='başlık')
div p İç içe geçmiş metin
//- Çıktı olmayacak yorum // HTML yorumu çıktı olacaktır
- var name = 'kullanıcı' p= name
Dönüştürme Uyarıları
- Karmaşık HTML yapılarının Pug en iyi uygulamalarına uygun olması için manuel ayarlamalar gerekebilir
- Pug girintiye dayalıdır, dönüştürülen kodun girintisinin doğru olduğundan emin olun
- Dönüştürmeden sonra HTML'deki komut dosyası ve stil bloklarının özel olarak ele alınması gerekebilir
- Büyük projeler için profesyonel Pug dönüştürücüler veya çerçeve eklentilerinin kullanılması önerilir
推荐工具
XML Biçimlendirme Aracı - XML Kodu Güzelleştirme ve Sıkıştırma için Ücretsiz Çevrimiçi Araç
XML kodu güzelleştirme, sıkıştırma, doğrulama gibi işlevleri destekleyen ücretsiz çevrimiçi XML biçimlendirme aracı, XML kodunuzu daha standart ve okunabilir hale getirir. Gerçek zamanlı biçimlendirme önizlemesi sağlar ve birçok XML biçimlendirme seçeneği destekler.
XML'den JSON'a - Ücretsiz Çevrimiçi Dönüştürme Aracı
XML'den JSON'a aracı, XML formatlı dizgileri ve JSON formatlı dizgileri ayrıştırabilir ve dönüştürebilir, ayrıca dönüştürülen dizgileri biçimlendirebilir.
Çevrimiçi JavaScript Biçimlendirici ve Küçültücü - JS Kodunu Güzelleştirin, Optimize Edin ve Karıştırın
JavaScript (JS) kodunu biçimlendirmek ve sıkıştırmak için güçlü bir çevrimiçi araç. Özel girintileri (sekme veya boşluk), kod katlama/açma, otomatik satır kaydırma, tek tıklamayla güzelleştirme ve JS betiklerini verimli bir şekilde sıkıştırma/karıştırma destekler; geliştiricilerin kodun okunabilirliğini artırmalarına, dosya boyutunu küçültmelerine ve web sitesi performansını optimize etmelerine yardımcı olur.
YAML'dan JSON'a Dönüştürücü - Ücretsiz Online Araç Kutusu
Çevrimiçi YAML (YML) ve JSON formatı karşılıklı dönüştürme aracı, YAML verileri ile JSON verileri arasında karşılıklı dönüştürmeyi destekler, ayrıca girilen YAML formatı verilerinin ve JSON formatı verilerinin doğru olup olmadığını doğrulamayı destekler.
YAML Biçimlendirme - Ücretsiz Çevrimiçi YAML Aracı
Otomatik girinti ayarı, sözdizimi vurgulama ve gereksiz boşlukları kaldırma desteği sunan ücretsiz çevrimiçi YAML biçimlendirme ve güzelleştirme aracı, YAML kodunuzu açık ve okunabilir kılar. Kurulum gerekmez, tek tıklamayla biçimlendirerek YAML dosyalarının okunabilirliğini ve bakım verimliliğini artırır!