Naudojimas

Peržiūrėti kaip Markdown Redaguoti per GitHub Dokumentacija: 3843abd

Pagrindinė eiga – vienas iškvietimas: pateikite TailwindPHP turinį ir pasirinktinę CSS konfigūraciją, o jis grąžins rastoms klasėms skirtą CSS. Klasių pavadinimai išgaunami iš žymėjimo, sukompiliuojami pagal išspręstą temą, o rezultate pateikiamos tik iš tikrųjų naudojamos pagalbinės klasės.

PHP

use TailwindPHP\tw;

$css = tw::generate('<div class="flex items-center p-4 bg-blue-500">Hello</div>');

Jei antrojo argumento nėra, generate() naudoja numatytąjį @import "tailwindcss" (tema + Preflight + pagalbinės klasės). Norėdami tinkinti, perduokite CSS eilutę arba masyvą.

Turinio nuskaitymas

TailwindPHP randa klasių pavadinimus, nuskaitydamas jūsų turinio class ir className atributus. Norėdami patikrinti, kas įtraukiama, naudokite tw::extractCandidates():

PHP

use TailwindPHP\tw;

tw::extractCandidates('<div class="flex p-4" className="bg-blue-500">');
// ['flex', 'p-4', 'bg-blue-500']

Nuskaitomi ir class, ir className atributai, o grąžinamas sąrašas pašalinus dublikatus. Savavališki kandidatai, pavyzdžiui, [mask-type:luminance] arba bg-[#1da1f2], išgaunami taip pat ir sukompiliuojami, jei galioja. Viskas, kas rodoma čia, yra būtent tai, ką sukompiliuos generate().

Įvesties formatai

Kiekvienas statinis metodas priima tris vienodus įvesties formatus:

Formatas	Parašas	Kada naudoti
Tik eilutė	`tw::generate($content)`	Numatytoji tema, be tinkinimo.
Eilutė + CSS eilutė	`tw::generate($content, $css)`	Greiti temos pakeitimai arba tiesioginės direktyvos.
Masyvas	`tw::generate(['content' => ..., 'css' => ...])`	Reikia `minify`, `importPaths` arba `cache`.

PHP

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,
]);

Parinktis priima tik masyvo formatas. Be css ir minify, jis priima importPaths (žr. Importai), cache ir cacheTtl (žr. Spartinimas podėliu).

Pakartotinai naudojamas kompiliatorius

Tą pačią konfigūraciją taikant daugeliui fragmentų – užklausų ciklui, šablonų paketui ar komponentų bibliotekai – pigiau naudoti vieną kompiliatoriaus egzempliorių. tw::compile() vieną kartą išsprendžia temą ir dizaino sistemą, tada jas naudoja pakartotinai:

PHP

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);

Kompiliatorius taip pat leidžia tikrinti ypatybes (properties(), computedProperties(), value(), computedValue()) ir pasiekti temą (colors(), breakpoints(), spacing()). Visus metodus rasite išsamioje API.

Įvesties CSS konfigūravimas

Didžioji dalis TailwindPHP galimybių slypi konfigūracijos eilutėje CSS. Skaitykite toliau:

Theme — @theme kintamieji ir vardų sritys.
Direktyvos — @apply, @utility, @layer, @custom-variant.
Importai — @import, virtualūs moduliai, importPaths ir Preflight.
@source — valdykite, kurie failai ir klasės nuskaitomi.