Přejít k obsahu

Direktiva @source

@source se zapisuje ve vstupním CSS. Její tvary inline() přidávají nebo odebírají kandidátní třídy a fungují všude. Tvary s cestou označují soubory šablon, které se mají prohledat kvůli názvům tříd; soubory prohledává pouze CLI a zatím nepoužívá zadané cesty (viz Jak se používají cesty).

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

Direktivy @source se zpracují při kompilaci a odstraní z výstupu — ve vygenerovaném CSS se nikdy neobjeví. Cesty musí být v uvozovkách; lze použít jednoduché i dvojité.

Cesty, globy a negace

Tvar s cestou přijímá adresář, glob nebo negovanou cestu a direktivy se kumulují:

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

Jak se používají cesty

Kompilátor zaznamená každou direktivu cesty do seznamu sources v poli, které vrací TailwindPHP\compile(), jako ['base' => …, 'pattern' => …, 'negated' => …], kde base pochází z volby kompilace base. Soubory sám nikdy nečte.

  • tw::generate(), tw::compile() a TailwindCompiler kompilují pouze předaný obsah. Direktivy cest na ně nemají vliv.
  • CLI čte sources, ale v aktuální verzi rekurzivně prohledává adresář vstupního souboru kvůli všem ne-negovaným cestám bez ohledu na zadanou cestu či glob a cesty not zcela ignoruje, takže nic nevylučují (#8). Podrobnosti a aktuálně funkční uspořádání najdete v části Co prohledává CLI.

Vložené kandidáty

@source inline(...) vynutí zahrnutí tříd do výstupu, i když se v prohledávaných souborech nevyskytují — hodí se pro názvy tříd skládané dynamicky za běhu:

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

Vložené kandidáty podporují také varianty:

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

Rozbalení složených závorek

Vložené vzory rozbalují skupiny ve složených závorkách, takže lze stručně vyjmenovat mnoho kandidátů:

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 */

Ignorované vložené kandidáty

@source not inline(...) dělá opak toho, co inline() — odstraní odpovídající kandidáty z výstupu, i když byly nalezeny v obsahu. Funguje zde také rozbalování složených závorek:

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

Pravidla ověřování

@source je příkaz, nikoli blok. Kompilátor odmítne:

  • Direktivu s tělem — @source cannot have a body.
  • Vnořenou direktivu (například uvnitř @media) — @source cannot be nested.
  • Cestu bez uvozovek — @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;

Pro sestavení ze souborů viz CLI; informace o vyřešení @import a virtuálních modulů najdete v části Importy.