انتقل إلى المحتوى

توجيه @source

عرض بتنسيق Markdown التعديل على GitHub التوثيق في 3843abd

توجد @source في CSS المدخل. تضيف صيغ inline() المرشحات أو تزيلها، وتعمل في كل مكان. أما صيغ المسارات فتحدد ملفات القوالب التي تُفحص بحثًا عن أسماء الفئات؛ ولا يفحص الملفات إلا CLI، وهو لا يطبّق المسارات التي تزوده بها حتى الآن (انظر كيفية استخدام المسارات).

CSS
@import "tailwindcss";
@source "./templates";

تُقرأ توجيهات @source أثناء التجميع وتُزال من الناتج — فهي لا تظهر مطلقًا في CSS المُنشأ. يجب وضع المسارات بين علامتي اقتباس، وتُقبل علامتا الاقتباس المفردة والمزدوجة.

المسارات والأنماط الشاملة والنفي

تقبل صيغة المسار مجلدًا أو نمطًا شاملًا أو مسارًا منفيًا، وتتراكم التوجيهات:

CSS
@source "./templates";              /* a directory */
@source "./components/**/*.php";    /* a glob */
@source not "./templates/legacy";   /* an exclusion */

كيفية استخدام المسارات

يسجل المُجمّع كل توجيه مسار في قائمة sources ضمن المصفوفة التي تُعيدها TailwindPHP\compile()، على شكل ['base' => …, 'pattern' => …, 'negated' => …] مع قيمة base مأخوذة من خيار التجميع base. ولا يقرأ الملفات بنفسه مطلقًا.

  • لا تُجمّع tw::generate() وtw::compile() وTailwindCompiler إلا المحتوى الذي تمرره. ولا تؤثر فيها توجيهات المسار.
  • يقرأ CLI الملفات sources، لكنه يفحص في الإصدار الحالي مجلد ملف الإدخال تكراريًا بحثًا عن كل مسار غير منفي، مهما كان المسار أو النمط الشامل، ويتخطى المسارات not بالكامل، لذا لا تستبعد شيئًا (#8). تتضمن الملفات التي يفحصها CLI التفاصيل وبنية ملفات تعمل حاليًا.

المرشحات المضمّنة

تُضيف @source inline(...) الفئات إلى الناتج إجباريًا، حتى إن لم تظهر مطلقًا في الملفات التي جرى فحصها — وهذا مفيد لأسماء الفئات التي تُركّب ديناميكيًا أثناء التشغيل:

CSS
@source inline("flex p-4 m-2");

تدعم المرشحات المضمّنة المتغيرات أيضًا:

CSS
@source inline("hover:bg-blue-500 focus:ring-2");

التوسعة بالأقواس

توسّع الأنماط المضمّنة مجموعات الأقواس، كي تتمكن من تعداد مرشحات كثيرة باختصار:

CSS
@source inline("p-{1,2,4}");
/* Generates p-1, p-2, and p-4 */

@source inline("text-{red,blue}-500");
/* Generates text-red-500 and text-blue-500 */

المرشحات المضمّنة المُهملة

تؤدي @source not inline(...) عكس ما تؤديه inline() — فهي تحذف المرشحات المطابقة من الناتج، حتى إن عُثر عليها في محتواك. وتعمل توسعة الأقواس هنا أيضًا:

CSS
@source not inline("legacy");
@source not inline("p-{1,2}");

قواعد التحقق

@source تصريح وليست كتلة. يرفض المُجمّع ما يلي:

  • توجيه يتضمن متنًا — @source cannot have a body.
  • توجيه متداخل (داخل @media مثلًا) — @source cannot be nested.
  • مسار غير محاط بعلامتي اقتباس — @source paths must be quoted.
CSS
/* Invalid — throws "`@source` cannot have a body." */
@source "./src" {
    .some-style { color: red; }
}

/* Invalid — throws "`@source` paths must be quoted." */
@source ./src;

راجع CLI للبناء المعتمد على الملفات، وImports لحل @import والوحدات الافتراضية.