محول HTML إلى Pug

قم بتحويل كود HTML بسرعة إلى كود Pug. يدعم التحويل في المتصفح المحلي، مع محرر أكواد وإكمال تلقائي.

1160 مرة استخدام | 5.0 تقييم

إدخال HTML

إخراج Pug

تعليمات الاستخدام

1

إدخال كود HTML

الصق أو أدخل كود HTML الذي تريد تحويله في مربع الإدخال الأيسر.

2

تنفيذ التحويل

انقر على زر "تحويل إلى Pug" لتحويل كود HTML إلى تنسيق Pug.

3

عرض النتائج

اعرض كود Pug المحول في مربع الإخراج الأيمن.

4

استخدام النتائج

انسخ أو قم بتنزيل كود Pug المحول لاستخدامه في مشروعك.

المعرفة الأساسية لمحرك القوالب Pug

ما هو Pug؟

Pug (المعروف سابقًا باسم Jade) هو محرك قالب عالي الأداء يُترجم إلى HTML ويُستخدم على نطاق واسع في بيئة Node.js. يوفر Pug بنية نحوية مختصرة وأنيقة، مما يتيح للمطورين كتابة صفحات HTML منظمة بأكواد أقل، كما يدعم المتغيرات والمزج والشروط المنطقية وغيرها من الخصائص المتقدمة.

المزايا الرئيسية لـ Pug

نحوية مختصرة، تقلل الكود الزائد

نحوية مبنية على المسافات البادئة، تحسن إمكانية قراءة الكود

يدعم توريث القوالب والتضمين

دعم قوي للتعبيرات المنطقية

تحويل تلقائي، يعزز الأمان

تكامل سلس مع نظام JavaScript البيئي

مقارنة بين نحوية HTML وPug

نحوية HTML:

صفحة الترحيب

هذه فقرة نموذجية

  • عنصر قائمة 1
  • عنصر قائمة 2
نحوية Pug:
.container
  h1 صفحة الترحيب
  p.description
    | هذه فقرة نموذجية
  ul
    li عنصر قائمة 1
    li عنصر قائمة 2

أمثلة نحوية Pug الشائعة

عناصر ونصوص
h1 نص العنوان
فئات ومعرفات
div.container#main
سمات مضمنة
a(href='رابط', title='عنوان')
محتوى متداخل
div
  p نص متداخل
تعليقات
//- تعليق لا يظهر في الإخراج
// تعليق HTML يظهر في الإخراج
متغيرات
- var name = 'مستخدم'
p= name

ملاحظات التحويل

  • قد تحتاج الهياكل HTML المعقدة إلى تعديل يدوي لتتوافق مع أفضل ممارسات Pug
  • يعتمد Pug على المسافات البادئة الصارمة، تأكد من أن المسافات البادئة في الكود المحول صحيحة
  • قد تحتاج كتل السكريبت والأنماط في HTML إلى معالجة خاصة بعد التحويل
  • بالنسبة للمشاريع الكبيرة، يُوصى باستخدام محولات Pug متخصصة أو إضافات إطار العمل
التسويق

API开发平台

快速构建、测试和部署API

推荐工具

أداة تنسيق XML - أداة مجانية عبر الإنترنت لتجليد وضغط كود XML

أداة تنسيق XML مجانية عبر الإنترنت تدعم وظائف مثل تجليد كود XML، الضغط، التحقق من الصحة، وغيرها، مما يجعل كود XML الخاص بك أكثر قياسًا وقراءة. توفر معاينة تنسيق فورية ودعم عدة خيارات تنسيق XML.

تحويل XML إلى JSON - أداة تحويل عبر الإنترنت مجانية

يمكن لأداة تحويل XML إلى JSON تحليل وتحويل سلاسل تنسيق XML وسلاسل تنسيق JSON، وتنسيق السلاسل المحولة.

أداة تنسيق وضغط JavaScript عبر الإنترنت - تجميل، تحسين، وتشويش كود JS

أداة قوية عبر الإنترنت لتنسيق وضغط كود JavaScript (JS). تدعم مسافات بادئة مخصصة (باستخدام علامات التبويب أو المسافات)، طي/فك طي الكود، الالتفاف التلقائي للسطور، تجميل الكود بنقرة واحدة، وضغط/تشويش فعّال لنصوص JS، مما يساعد المطورين على تحسين قابلية قراءة الكود، وتقليل حجم الملف، وتحسين أداء الموقع.

محول YAML إلى JSON - صندوق الأدوات المجاني عبر الإنترنت

أداة تحويل متبادل بين تنسيقات YAML (YML) و JSON عبر الإنترنت، تدعم التحويل المتبادل بين بيانات YAML و JSON، وتدعم أيضًا التحقق من صحة بيانات تنسيق YAML و JSON المدخلة.

تنسيق YAML - أداة YAML عبر الإنترنت المجانية

أداة تنسيق وتحسين مظهر YAML عبر الإنترنت المجانية التي تدعم ضبط المسافة البادئة التلقائي، وتسليط الضوء على النحو، وإزالة الفراغات الزائدة، مما يجعل كود YAML الخاص بك واضحًا وسهل القراءة. لا حاجة للتثبيت، تنسيق одним نقرًا لتحسين قابلية قراءة وكفاءة صيانة ملفات YAML!