Użycie
Podstawowy przebieg pracy to jedno wywołanie: przekaż TailwindPHP swoją treść oraz opcjonalną konfigurację CSS, a otrzymasz CSS klas, które znajdzie. Nazwy klas są wyodrębniane ze znaczników, kompilowane względem rozpoznanego motywu, a wynik zawiera tylko używane przez Ciebie narzędzia.
use TailwindPHP\tw;
$css = tw::generate('<div class="flex items-center p-4 bg-blue-500">Hello</div>');
Bez drugiego argumentu generate() używa domyślnego @import "tailwindcss" (motyw + Preflight + narzędzia). Przekaż ciąg CSS lub tablicę, aby dostosować ustawienia.
Skanowanie treści
TailwindPHP wyszukuje nazwy klas, odczytując atrybuty class i className w treści. Aby sprawdzić, co zostanie wyodrębnione, użyj tw::extractCandidates():
use TailwindPHP\tw;
tw::extractCandidates('<div class="flex p-4" className="bg-blue-500">');
// ['flex', 'p-4', 'bg-blue-500']
Skanowane są oba atrybuty class i className, a zwrócona lista nie zawiera duplikatów. Dowolne kandydaty (takie jak [mask-type:luminance] lub bg-[#1da1f2]) są wyodrębniane w ten sam sposób i kompilowane, jeśli są poprawne. generate() skompiluje dokładnie to, co pojawi się tutaj.
Formaty wejściowe
Każda metoda statyczna obsługuje te same trzy rodzaje danych wejściowych:
| Format | Sygnatura | Kiedy używać |
|---|---|---|
| Tylko ciąg | tw::generate($content) |
Domyślny motyw, bez dostosowywania. |
| Ciąg + ciąg CSS | tw::generate($content, $css) |
Szybkie zmiany motywu lub dyrektywy podane bezpośrednio. |
| Tablica | tw::generate(['content' => ..., 'css' => ...]) |
Gdy potrzebujesz minify, importPaths lub cache. |
use TailwindPHP\tw;
// Format 1: String only
tw::generate('<div class="flex">');
// Format 2: String + CSS string
tw::generate('<div class="flex">', '@import "tailwindcss"; @theme { --color-brand: #3b82f6; }');
// Format 3: Array with content, css, and options
tw::generate([
'content' => '<div class="flex p-4">',
'css' => '@import "tailwindcss";',
'minify' => true,
]);
Tylko w postaci tablicy można przekazać opcje. Oprócz css i minify obsługuje ona importPaths (zobacz Importy), cache oraz cacheTtl (zobacz Buforowanie).
Kompilator wielokrotnego użytku
Kompilowanie wielu fragmentów przy użyciu tej samej konfiguracji — w pętli żądań, zbiorze szablonów lub bibliotece komponentów — jest tańsze przy użyciu jednej instancji kompilatora. tw::compile() raz rozpoznaje motyw i system projektowy, a następnie używa ich ponownie:
use TailwindPHP\tw;
$compiler = tw::compile('@import "tailwindcss"; @theme { --color-brand: #3b82f6; }');
$css = $compiler->generate('<div class="flex p-4 bg-brand">');
$candidates = $compiler->extractCandidates('<div class="flex p-4 bg-brand">');
$minified = $compiler->minify($css);
Kompilator udostępnia też inspekcję właściwości (properties(), computedProperties(), value(), computedValue()) oraz metody dostępu do motywu (colors(), breakpoints(), spacing()). Pełna dokumentacjaAPI zawiera opis wszystkich metod.
Konfigurowanie danych wejściowych CSS
Większość możliwości TailwindPHP kryje się w ciągu CSS przekazywanym jako konfiguracja. Przejdź do: