Dyrektywa @source

Wyświetl jako Markdown Edytuj w GitHub Dokumentacja: 3843abd

@source znajduje się w wejściowym CSS. Jej postacie dotyczące inline() dodają lub usuwają kandydatów na klasy i działają wszędzie. Postacie ścieżek wskazują pliki szablonów skanowane w poszukiwaniu nazw klas; pliki skanuje tylko CLI, który na razie nie stosuje podanych ścieżek (zobacz Jak używane są ścieżki).

CSS

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

Dyrektywy @source są odczytywane podczas kompilacji i usuwane z wyniku — nigdy nie pojawiają się w wygenerowanym CSS. Ścieżki muszą być ujęte w cudzysłowy; akceptowane są zarówno pojedyncze, jak i podwójne.

Ścieżki, wzorce glob i negacja

Postać ścieżki obsługuje katalog, wzorzec glob lub ścieżkę z negacją, a dyrektywy są kumulowane:

CSS

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

Jak używane są ścieżki

Kompilator zapisuje każdą dyrektywę ścieżki na liście sources tablicy zwracanej przez TailwindPHP\compile() jako ['base' => …, 'pattern' => …, 'negated' => …], której base pochodzi z opcji kompilacji base. Sam nie odczytuje plików.

tw::generate(), tw::compile() i TailwindCompiler kompilują tylko przekazaną treść. Dyrektywy ścieżek nie mają tu wpływu.
CLI odczytuje sources, ale w bieżącej wersji rekurencyjnie skanuje katalog pliku wejściowego pod kątem każdej ścieżki bez negacji, niezależnie od ścieżki lub wzorca glob, i całkowicie pomija ścieżki not, więc niczego nie wykluczają (#8). Szczegóły i układ działający obecnie opisano w sekcji Co skanuje CLI.

Kandydaci wbudowani

@source inline(...) wymusza dodanie klas do wyniku, nawet jeśli nie występują w skanowanych plikach — przydatne w przypadku nazw klas tworzonych dynamicznie w czasie działania programu:

CSS

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

Kandydaci wbudowani obsługują również warianty:

CSS

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

Rozwijanie nawiasów klamrowych

Wzorce wbudowane rozwijają grupy w nawiasach klamrowych, dzięki czemu można zwięźle wyliczyć wiele kandydatów:

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

Ignorowani kandydaci wbudowani

@source not inline(...) działa odwrotnie niż inline() — usuwa pasujących kandydatów z wyniku, nawet jeśli znaleziono ich w treści. Tutaj także działa rozwijanie nawiasów klamrowych:

CSS

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

Zasady walidacji

@source jest instrukcją, a nie blokiem. Kompilator odrzuca:

Dyrektywę z treścią — @source cannot have a body.
Zagnieżdżoną dyrektywę (na przykład wewnątrz @media) — @source cannot be nested.
Nieujęta w cudzysłowy ścieżkę — @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;

Informacje o kompilacjach opartych na plikach znajdziesz w sekcji CLI, a o rozpoznawaniu @import i modułów wirtualnych — w sekcji Importy.