Pereiti prie turinio

Direktyva @source

@source naudojama įvesties CSS. Jos inline() formos prideda arba pašalina klasių kandidatus ir veikia visur. Kelio formomis nurodomi šablonų failai, kuriuose ieškoma klasių pavadinimų; failus nuskaito tik CLI, o šiuo metu nurodyti keliai dar netaikomi (žr. Kaip naudojami keliai).

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

@source direktyvos nuskaitomos kompiliavimo metu ir pašalinamos iš išvesties — sugeneruotame CSS jos niekada nepasirodo. Kelius būtina rašyti kabutėse; tinka ir viengubos, ir dvigubos kabutės.

Keliai, šablonai ir neigimas

Kelio forma priima katalogą, šabloną arba neigiamą kelią; direktyvos kaupiamos:

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

Kaip naudojami keliai

Kompiliatorius įrašo kiekvieną kelio direktyvą į sources sąrašą masyve, kurį grąžina TailwindPHP\compile(), kaip ['base' => …, 'pattern' => …, 'negated' => …] reikšmę, kurios base paimamas iš kompiliavimo parinkties base. Pats failų jis niekada neskaito.

  • tw::generate(), tw::compile() ir TailwindCompiler sukompiliuoja tik perduotą turinį. Kelio direktyvos čia neturi poveikio.
  • CLI nuskaito sources, bet dabartiniame leidime rekursyviai nuskaito įvesties failo katalogą ieškodamas kiekvieno neneigiamo kelio, nepaisydamas nurodyto kelio ar šablono, o not kelius visiškai praleidžia, todėl jie nieko neatmeta (#8). Išsami informacija ir šiuo metu veikiantis išdėstymas pateikti skiltyje Ką nuskaito CLI.

Tiesioginiai kandidatai

@source inline(...) priverstinai įtraukia klases į išvestį, net jei jos nepasirodo nuskaitomuose failuose — tai naudinga, kai klasių pavadinimai surenkami dinamiškai vykdymo metu:

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

Tiesioginiai kandidatai palaiko ir variantus:

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

Skliaustų išskleidimas

Tiesioginiai šablonai išskleidžia skliaustų grupes, todėl galima glaustai išvardyti daug kandidatų:

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

Nepaisomi tiesioginiai kandidatai

@source not inline(...) veikia priešingai nei inline() — pašalina atitinkančius kandidatus iš išvesties, net jei jie buvo rasti turinyje. Čia taip pat veikia skliaustų išskleidimas:

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

Tikrinimo taisyklės

@source yra sakinys, o ne blokas. Kompiliatorius atmeta:

  • Direktyvą su turiniu — @source cannot have a body.
  • Įdėtą direktyvą (pavyzdžiui, @media viduje) — @source cannot be nested.
  • Kelią be kabučių — @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;

Failų pagrindu atliekamam kompiliavimui žr. CLI, o importų ir @import bei virtualių modulių sprendimui – Importai.