استخدام معالجات CSS الأولية في Dreamweaver

تاريخ آخر تحديث 25 سبتمبر 2023

تعرف على كيفية العمل باستخدام ملفات معالجات CSS الأولية وتحويلها برمجيًا في داخل Dreamweaver.

CSS هي لغة تصف نمط مستند HTML. تقوم معالجات CSS الأولية بالتحويل البرمجي للتعليمات البرمجية المكتوبة في لغة معالجة سابقة للغة CSS الأكثر شيوعًا. ترفع اللغة المعالجة مسبقًا CSS إلى مستوى أقرب للغة البرمجة.

على وجه التحديد، تتيح لك المعالجات المسبقة استخدام المتغيرات والمزجيات والوظائف والعديد من التقنيات الأخرى التي
غير متاحة في CSS.باستخدام معالجات CSS المسبقة، يمكنك تعريف كل شيء مرة واحدة وإعادة استخدامه بشكل متكرر مما ينتج عنه CSS قابل للصيانة والتوسيع.

باستخدام معالج CSS الأولي، يمكنك أيضًا الكتابة بلغة CSS بشكل أفضل وأسهل في الصيانة. إذا كنت تقوم بإنشاء مواقع تشير إلى عدد من ملفات CSS، فإن استخدام معالجات CSS المسبقة مثل Sass أو Compass يمكن أن يقلل من الترميز اليدوي وإجراءات النسخ واللصق.

يستخدم Dreamweaver منشئ Ruby-Saas المضمن للتحويل البرمجي لملفات SCSS وLESS. يدعم Dreamweaver أيضًا أطر عمل Compass وBourbon لتجميع ملفات Sass. 

يستند LESS إلى لغة JavaScript، بينما يستند Sass إلى Ruby. ومع ذلك، لا يلزم عليك معرفة أي شيء عن أيّ من هاتين اللغتين. ولا يلزم عليك استخدام سطر الأوامر لتحويل الملفات برمجيًا إلى CSS. يقوم Dreamweaver بتجميع هذه الملفات تلقائيًا إلى CSS باستخدام مكتبة JavaScript less.js، عندما تقوم بتحميل هذه الملفات أو تحريرها أو حفظها.

الإصدارات المدعومة:

  • Sass: 3.4.25
  • LESS: 2.7.2
  • Compass: 1.0.3
  • Bourbon: 4.2.6
  • Bourbon Neat: 1.7.3
  • Bourbon Bitters: 1.2.0

طريقة معالجة Dreamweaver لمعالجات CSS الأولية

تختلف طريقة معالجة Dreamweaver لمعالجات CSS الأولية سواءٌ ما إذا كنت قد قمت بتحديد موقع أم لا. إذا قمت بتعريف موقع، يمكنك إعداد تفضيلات معالج CSS المسبق، واستخدام أطر عمل Compass وBourbon من داخل Dreamweaver.

وعند تحديد موقع، يمكنك تخصيصه بنفس طريقة عمل معالجات CSS الأولية داخل Dreamweaver من خلال إعداد تفضيلات معالجات CSS الأولية الخاصة بالمواقع. يتيح تعيين تفضيلات معالجات CSS الأولية الخاصة بالمواقع لك تحديد خيارات التحويل البرمجي على أساس الموقع. يمكنك أيضًا تخصيص موقع ملفات Sass وCSS، وخيارات المعالج المسبق الخاصة بكل موقع.

تابع القراءة لتعرف كيفية استخدام Dreamweaver مع معالجات CSS المسبقة:

Dreamweaver 2017 ومعالجات CSS الأولية

في Dreamweaver 2017، تم تضمين دعم معالجات CSS الأولية في Dreamweaver. أي أنه يمكنك العمل على ملفات Sass/LESS/SCSS داخل Dreamweaver. يتيح لك النقر فوق Ctrl+S or Cmd+S فقط التحويل البرمجي التلقائي للغة CSS في Dreamweaver. يمكنك أيضًا تحويل ملفات CSS برمجيًا يدويًا باستخدام Tools > Compile (أو F9). تنعكس التغييرات أيضًا في جميع ملفات HTML المفتوحة حيث يتم ربط أو إرفاق ملف CSS المجمع هذا.

فيما يلي سير عمل عالي المستوى للمهام المطلوبة عند استخدام معالجات CSS المسبقة:

  • قم بتثبيت برنامج التحويل البرمجي المناسب إذا كنت تريد استخدام Compass أو Bourbon من داخل Dreamweaver. يتم هذا التثبيت من خلال عملية من نقرة واحدة. قم بإعداد إعدادات معالج CSS المسبق.

قم بتثبيت برنامج التحويل البرمجي فقط إذا كنت تريد نسخة من ملفات إطار العمل (Bourbon)، أو إذا كنت تريد إنشاء ملفات scss الافتراضية وملفات التكوين المستندة إلى Ruby ‏(Compass). يوصى بالاحتفاظ بنسخة من ملفات إطار العمل. إذا تمت إزالة مزائج أو وظائف معينة من إطار عمل التأليف في المراجعات اللاحقة، لا يزال بإمكانك الوصول إلى ملفات المعالج المسبق داخل موقعك.

  • تأكد من تمكين التحويل البرمجي التلقائي. ثم اضغط على حفظ لتحديث ملفات CSS.
  • (اختياري) اعرض التغييرات التي تنعكس في العرض المباشر أو المعاينة في الوقت الفعلي في جميع صفحات HTML حيث يتم استخدام CSS المُنشأ.

Dreamweaver 2015 ومعالجات CSS الأولية

في Dreamweaver 2015 والإصدارات السابقة من CC، يمكنك استخدام ملفات Sass وLESS و SCSS مع Dreamweaver. ومع ذلك، كان عليك تجميع هذه الملفات بنفسك خارج تطبيق Dreamweaver.
سيشبه سير عملك الخطوات التالية:

  1. قم بتنزيل وتثبيت مجمع.
  2. قم بإعداد وظيفة grunt (Gruntfile.js) للمُجمِّع لقراءة ملف Sass/LESS/SCSS الخاص بك.
  3. قم بإعداد مهمة grunt أخرى لتجميع الملف إلى CSS، والتي ستقوم بجلبها بعد ذلك إلى Dreamweaver.

يجب أن تؤدي هذه الخطوات في كل مرة تقوم فيها بإجراء تغيير في ملف Sass/LESS/SCSS الخاص بك.

ملاحظة

شاهد هذا الدرس التعليمي بالفيديو لتتعلم كيف يمكنك تحسين CSS باستخدام المعالجات المسبقة.

وإذا لم يكن لديك موقع محدد، فيمكنك اختيار تحويل ملفات Sass وLESS برمجيًا يدويًا. لكن الدعم لإطاري عمل Compass وBourbon frameworks غير مدعوم.

كيف تُستخدم معالجات CSS الأولية في Dreamweaver؟

إليك سير العمل عالي المستوى للمهام المتضمنة عند استخدام معالجات CSS المسبقة:

  1. قم بتحديد موقع في Dreamweaver. تأكد أن ملف LESS الذي تحاول تحويله برمجيًا موجود في المجلد الجذر للموقع. وإذا كنت قد حددت بالفعل موقعًا وتم تضمين ملف Sass/LESS في الموقع الجذر، فواصل القيام بالخطوة التالية. لمزيد من المعلومات حول إعداد موقع Dreamweaver، راجع حول مواقع Dreamweaver.
  2. تعيين التفضيلات لمعالجات CSS الأولية (مثل تحديد موقع ملفات CSS التي تم إنشاؤها). هذه التفضيلات خاصة بالموقع. لمزيد من المعلومات، راجع تعيين تفضيلات معالج CSS المسبق الخاص بالموقع.
  3. إذا كنت تريد استخدام أطر عمل محددة، مثل Compass أو Bourbon، فيمكنك تحديد الإعدادات لأطر العمل هذه. لمزيد من المعلومات، راجع: استخدام إطار عمل Compass أو استخدام إطار عمل Bourbon.
  4. إعداد إكمال تلقائي أو تحويل ملفات LESS برمجيًا يدويًا. لمزيد من المعلومات، راجع تجميع ملفات معالج CSS المسبق.

ضبط التفضيلات لمعالجات CSS الأولية

يمكنك تعيين تفضيلات خاصة بالموقع لمعالجات CSS المسبقة باستخدام مربع الحوار المواقع > إدارة المواقع.

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

ملاحظة

الإعدادات في القسمين الفرعيين عام، والمصدر والإخراج قابلة للتطبيق على إطار عمل Ruby-Saas بشكل افتراضي. 

لتعيين التفضيلات لـ Compass، يجب أن تحدد مربع الاختيار استخدام Compass في قسم Compass

تعيين إعدادات معالجات CSS الأولية العامة

يمكنك تعيين تفضيلات معالجات CSS الأولية العامة التالية في مربع حوار Sites > Manage Sites > CSS Preprocessors. بشكل افتراضي، هذه الإعدادات قابلة للتطبيق على إطار عمل Saas.

إعدادات معالجات CSS الأولية العامة
إعدادات معالجات CSS الأولية العامة

Enable Auto Compilation on File Save

حدد هذا الخيار لتمكين التحويل البرمجي لمعالجات CSS الأولية تلقائيًا. إذا قمت بتحديد هذا الخيار، سيقوم Dreamweaver تلقائيًا بإنشاء ملف CSS عندما تقوم بحفظ ملف Sass أو LESS أو SCSS لديك. إذا تُرك هذا الخيار غير محدد، سيكون عليك تجميع الملفات يدوياً في كل مرة تقوم فيها بإجراء تغيير.

خيارات LESS

Enable Strict Math

قم بمعالجة هذه العمليات الحسابية في أقواس فقط. فعلى سبيل المثال، تتم معالجة (100 بكسل/25 بكسل) بنجاح بينما لم تتم معالجة 20% + 10% (دون أقواس). عندما يكون هذا الخيار معطلاً، يتم معالجة كل العمليات الحسابية في الملف.

Enable Strict Units

وبدون هذا الخيار، يحاول LESS التخمين في وحدة الإخراج عندما تقوم بالحسابات الرياضية. على سبيل المثال:

.class {

property: 1px * 2px;

}

في هذه الحالة، يعطي الطول مضروبًا في الطول منطقة، لكن CSS لا يدعم تحديد المنطقة. يفترض Dreamweaver أن المستخدم قصد أن تكون إحدى القيم قيمة وليس وحدة طول.

مع تشغيل الوحدات الصارمة، يفترض Dreamweaver أنه خطأ في الحساب، ويعرض رسالة خطأ.

Rewrite URLs as Relative URLs

يتيح لك هذا الخيار إعادة كتابة عناوين URL في ملف CSS الذي يتم إنشاؤه بحيث تكون عناوين URL دائماً نسبية للملف المُنشأ. 

Generate Source map

لإنشاء المخطط المصدر. خريطة المصدر هي ملف يسد الفجوة بين اللغات عالية المستوى مثل Sass وLESS، واللغة منخفضة المستوى التي يتم تجميعها إليها، مثل CSS.

خيارات Sass/SCSS

Output File Style

يحدد نمط ملف إخراج CSS:

  • متداخل - ينسق ملف CSS المُجمَّع في البنية النمطية المعروفة.
  • مضغوط - ينسق CSS المترجم في بنية مضغوطة تشغل مساحة أقل من المتداخل أو الموسع.
  • مضغوط - ينتج CSS في بنية مسطحة.
  • Expanded - يقوم بإخراج CSS بشكل موسع مع شغل كل خاصية وقاعدة لسطر واحد. يتم إزاحة الخصائص داخل القواعد، لكن القواعد لا يتم إزاحتها بأي طريقة. 

Create Source Comments

ينشئ تعليقات في ملف CSS الناتج تربط كود CSS بالسطر الذي تم إنشاؤه منه.

Generate Source map

ينشئ خريطة مصدر (ملف يربط بين اللغات عالية المستوى مثل Sass وLESS، واللغة منخفضة المستوى التي يتم ترجمتها إليها، مثل CSS). 

تعيين تفصيلات مصدر وإخراج CSS

يمكنك تحديد مكان وضع ملفات CSS المُنشأة، والمسار الذي يجب على Dreamweaver مراقبته وتشغيل الترجمة التلقائية عند تعديل ملف Sass/LESS في المسار باستخدام محرر خارجي.

ملاحظة

تنطبق الخيارات الموجودة في قسم Source & Output بشكل افتراضي على Saas. لتمكين هذه الخيارات لـ Compass، يجب تحديد مربع الاختيار استخدم Compass في قسم Compass.

وبعد تعديل هذه الإعدادات وتثبيت Compass، يتم ترحيل جميع الإعدادات إلى config.rb. في وقت لاحق، إذا كنت تريد تعديل أي إعدادات، قم بتحرير الإعدادات مباشرة في ملف config.rb. كما أن التغييرات التي تُجرى في مربع حوار إعدادات الموقع لا تؤثر على التجميع.

تعيين إعدادات Source & Output لـ Compass
تعيين إعدادات Source & Output لـ Compass

يمكنك ضبط إعدادات معالج CSS التالية للمصدر والإخراج في مربع حوار المواقع > إدارة المواقع.

إعدادات معالج CSS الأولي للمصدر والإخراج
إعدادات معالج CSS الأولي للمصدر والإخراج

إخراج CSS

حدد موقع ملف إخراج CSS الذي يتم إنشاؤه.

In the same folder as source

حدد هذا الخيار إذا كنت تريد حفظ ملفات CSS المُنشأة في نفس المجلد مع ملفات Sass وLESS المصدر.

Define output folder

حدد هذا الخيار وحدد مجلداً تريد حفظ ملفات CSS المُنشأة فيه.

Replace segment of input path

يتيح لك هذا الخيار استبدال جزء من المسار باستخدام سلاسل From وTo. على سبيل المثال، عند ضبط من: scss وإلى: css، يتم وضع ملف الإخراج داخل نفس بنية الشجرة بعد استبدال SCSS في مسار css.

Source Folder

حدد المجلد الفرعي داخل جذر الموقع الذي يحتاج إلى مشاهدته. عادةً، يحتوي هذا المجلد الفرعي على جميع ملفات SCSS أو LESS الخاصة بك. 

إذا قمت بتمكين Compilation في General settings، سيقوم Dreamweaver تلقائي بتشغيل معالج CSS الأولي. يشغل Dreamweaver الترجمة التلقائية عند تعديل أي ملف داخل المجلد خارجياً، أو من داخل Dreamweaver.

استخدام إطار عمل Compass

Compass هو إطار عمل مفتوح المصدر لتأليف CSS يتيح لك إنشاء أوراق أنماط CSS3 باستخدام Sass.

يوفر Dreamweaver الدعم إلى Compass. إذا كنت تنشئ أوراق أنماط باستخدام Compass، يمكنك ترجمة أوراق الأنماط هذه وإنشاء ملفات CSS من داخل Dreamweaver.

استخدم ملفات Compass.

إذا لم يكن لديك Compass مثبت بالفعل، يمكنك تثبيته من داخل Dreamweaver.

في مربع حوار Site Setup، حدد CSS Preprocessors > Compass. حدد Use Compass ثم انقر تثبيت الملفات.

تثبيت ملفات Compass
تثبيت ملفات Compass

يتم تثبيت جميع ملفات Compass وملف التكوين *.rb داخل مجلد موقعك، ويمكنك رؤيتها في لوحة الملفات.

ملفات Compass المثبتة
ملفات Compass المثبتة

تحديد ملف تكوين حالي مستند إلى Ruby

إذا كان لديك Compass مثبت بالفعل في حاسوبك، ولديك ملف Compass *.rb معد، في مربع حوار إعداد موقع Dreamweaver، حدد المسار إلى ملف Compass *.rb داخل جذر الموقع الحالي.

  1. في مربع حوار إعداد الموقع، حدد معالجات CSS > Compass.
  2. حدد مربع الاختيار Use Compass.
  3. انقر فوق تحديد ملف التكوين المستند إلى Ruby، واستعرض موقع الملف. 
  4. انقر فوق حفظ عند الانتهاء.
تحديد ملف تكوين حالي مستند إلى Ruby
تحديد ملف تكوين حالي مستند إلى Ruby

ملاحظة

يجب أن يقع هذا الملف في مجلد جذر موقعك.

تحديد خيارات التكوين يدويًا

إذا لم يكن لديك خيار تكوين موجود، يمكنك تحديد التكوينات يدوياً.

  1. في مربع الحوار Site Setup، حدد CSS Preprocessors > Compass.
  2. حدد مربع الاختيار Use Compass.
  3. انقر فوق Specifying Configuration Options manually. حدد خيارات التكوين التالية، وانقر فوق Save.

يتم ملء الحقول التالية تلقائياً، ولكن يمكنك تغييرها وفقاً لمتطلباتك:

ملاحظة

يجب أن تكون جميع المسارات المحددة في هذه الخيارات ضمن جذر الموقع.

HTTP Path

المسار إلى المشروع عند التشغيل داخل خادم الويب. القيمة الافتراضية هي "/".

Images Directory

الدليل الذي يتم فيه الإبقاء على الصور. الدليل نسبي بالنسبة إلى project_path.

Generated Images Directory

الدليل الذي يتم فيه الإبقاء على الصور التي تم إنشاؤها. هذا الدليل نسبي إلى project_path، ويكون افتراضياً مساوياً لقيمة images_dir.

Fonts Directory

الدليل حيث يتم الاحتفاظ بملفات الخطوط.

Relative Assets

يشير إلى ما إذا كانت وظائف المساعد في compass يجب أن تُنشئ عناوين URL نسبية من CSS المُنشأ إلى الأصول، أم عناوين URL مطلقة باستخدام مسار http لنوع ذلك الأصل.

إذا حددت Enable Auto Compilation on File Save، في مربع الحوار Sites > Manage Sites > CSS Preprocessors، فإن Adobe Dreamweaver ينشئ ملف CSS في كل مرة تحفظ فيها تغييرات على ملفات Sass الخاصة بك.

يمكنك أيضًا معاينة هذه التغييرات في الوقت الحقيقي في نافذة المستعرض لديك. لمزيد من المعلومات حول معاينة تغييراتك في الوقت الفعلي في المتصفح، راجع Real-time preview.

إذا كنت لا تريد التجميع التلقائي، يمكنك تجميع ملف CSS يدوياً بإجراء أحد الأمور التالية:

  • انقر بزر الماوس الأيمن على ملف Sass أو LESS أو SCSS في لوحة Files وانقر فوق Compile
  • انقر فوق Tools > Compile لتجميع الملف الحالي.

يمكنك عندئذ إرفاق ملف CSS الذي تم تحويله برمجيًا بملفات HTML في موقعك. لمزيد من المعلومات، راجع Link to an external CSS style sheet.

استخدام إطار عمل Bourbon

يقوم Dreamweaver بدعم مجموعة منتجات Bourbon. إذا قمت بإنشاء أوراق الأنماط باستخدام Bourbon، يمكنك تجميع أوراق الأنماط هذه وإنشاء ملفات CSS من داخل Adobe Dreamweaver.

أنواع Bourbon التالية مدعومة:

  • Bourbon - مكتبة خلط بسيطة وخفيفة الوزن لـ Sass
  • Bourbon Neat - إطار عمل شبكة دلالي خفيف الوزن لـ Sass وBourbon
  • Bourbon Bitters - أنماط سقالات وبنية لمشروعات Bourbon

يمكنك استيراد إطار عمل Bourbon عن طريق إضافة أحد العناصر التالية في الكود الخاص بك:

  • @import "bourbon" - لاستيراد Bourbon
  • @import "neat" – لاستيراد Bourbon Neat
  • @import "base" – لاستيراد Bourbon Bitter

يستخدم Dreamweaver بعد ذلك الإصدار المُعد مسبقًا من Bourbon أثناء تجميع ملفات المعالج المسبق.

في المقابل يمكنك تثبيت ملفات إطار عمل Bourbon لموقعك كي لا تؤثر التحديثات الإضافية لـ Dreamweaver على عمليات سير عمل التحويل البرمجي الخاصة بك. يتم نسخ ملفات إطار عمل Bourbon إلى موقعك. Bourbon هو إطار العمل الذي يتم استخدامه عند تشغيل التجميع لأي من الملفات التي تستورد إطار العمل.

تثبيت ملفات Bourbon أو Bourbon Neat أو Bourbon Bitters

لتثبيت Bourbon أو أي من إصداراته:

في مربع حوار Site Setup، حدد CSS Preprocessors > Bourbon، Bourbon Neat، أو Bourbon Bitters.

انقر فوق Install Files لتثبيت الملفات في موقع مجلد جذر الموقع المحدد داخل موقعك.

تثبيت ملفات Bourbon
تثبيت ملفات Bourbon

يتم تثبيت جميع ملفات Bourbon داخل مجلد موقعك، ويمكنك رؤيتها في لوحة Files.

ملفات Bourbon المثبتة
ملفات Bourbon المثبتة

في حالة حدوث فشل، يتم عرض الأخطاء في اللوحة Output (Window > Results > Output)، ويتغير رمز شريط الحالة إلى اللون الأحمر.

تحويل ملفات معالج CSS الأولي برمجيًا

إعداد التحويل البرمجي التلقائي لملفات معالج CSS الأولي

يمكنك إعداد الخيارات داخل Dreamweaver لتحويل التغييرات التي تتم في ملف Sass أو LESS برمجيًا في CSS المكافئ له. يمكنك أيضًا تحديد المواقع (داخل جذر الموقع) حيث تريد حفظ CSS المُنشأ.

في مربع حوار Site Setup، حدد CSS Preprocessors > General > Enable Auto Compilation on File Save.

تمكين التحويل البرمجي التلقائي
تمكين التحويل البرمجي التلقائي

انقر فوق CSS Preprocessors > Source & Output.

حدد المواقع التي تريد حفظ ملفات CSS التي قمت بإنشائها بها. يمكنك اختيار أحد الخيارات التالية:

In the same folder as source

حدد هذا الخيار إذا كنت تريد حفظ ملفات CSS المُنشأة في نفس المجلد كملفات Sass وLESS المصدر.

Define output folder

حدد هذا الخيار وحدد المجلد الذي تريد حفظ ملفات CSS المُنشأة فيه.

Replace segment of input path

يتيح لك هذا الخيار استبدال جزء من المسار باستخدام سلاسل From وTo.

حدد المجلد الذي يحتوي على ملفات Sass أو LESS التي يتتبعها Dreamweaver. 

إذا قمت بإجراء تغييرات على أي من الملفات داخل المجلد الذي يتم تتبعه، فإن Dreamweaver يجمع الملفات تلقائيًا بعد حفظها. 

إعدادات معالج CSS الأولي للمصدر والإخراج
إعدادات معالج CSS الأولي للمصدر والإخراج

ملاحظة

يراقب Dreamweaver ويجمع هذه الملفات حتى لو قمت بإجراء تغييرات خارج Dreamweaver (باستخدام محرر نصوص، على سبيل المثال).

بعد التجميع الناجح، يتم عرض رسالة في اللوحة Output (Window > Results > Output).يتم عرض رمز الحالة في شريط الحالة باللون الأخضر.لفتح CSS المُجمَّع، انقر نقرًا مزدوجًا فوق رسالة النجاح في اللوحة.

إذا تم العثور على أية أخطاء، فهذا يعني أنه لم يتم تحويل CSS برمجيًا بنجاح. يتم عرض رمز الحالة باللون الأحمر وتقوم لوحة Output بإدراج جميع الأخطاء والتحذيرات. يمكنك النقر بشكل مزدوج فوق رسالة خطأ في اللوحة للانتقال السريع إلى السطر الذي يحتوي على أخطاء في التعليمة البرمجية. لا يتم تجميع ملف CSS بنجاح حتى يتم حل جميع الأخطاء.

ملاحظة

يتم إرساء Output في أسفل مساحة العمل. إذا كانت اللوحة مغلقة، انقر فوق Window > لوحة Output.

يمكنك أيضًا تبديل لوحة Output (إظهار/إخفاء) باستخدام أيقونة الحالة، عندما تكون الحالة حمراء.

بعد الحصول على ملف CSS المجمع، يمكنك ربط صفحة الويب بورقة الأنماط. عند إجراء أي تغييرات على معالجات CSS، يتم تحديث ملفات CSS المجمعة المتوافقة تلقائيًا. تتم أيضًا عملية التحديث التلقائي لصفحة الويب في Live View.

لمزيد من المعلومات حول ربط صفحة الويب الخاصة بك بورقة الأنماط، راجع Link to an external CSS style sheet.

التحويل البرمجي يدويًا لملف معالج CSS أولي

في بعض الحالات (مثل إذا لم تكن قد حددت موقع Dreamweaver)، قد ترغب في تجميع ملف معالج CSS يدويًا.

في مثل هذه السيناريوهات، قم بتعطيل Enable Auto Compilation on File Save في لوحة CSS Preprocessors > General في مربع حوار Site Setup.

لتجميع معالج CSS يدويًا، انقر بزر الماوس الأيمن فوق الملف في لوحة Files، وانقر فوق Compile.

تحويل ملفات معالجات CSS الأولية برمجيًا من خلال لوحة Files
تحويل ملفات معالجات CSS الأولية برمجيًا من خلال لوحة Files

يمكنك أيضًا النقر فوق Tools > Compile لتجميع الملف الحالي.