Die @source-Direktive

@source steht in deinem Eingabe-CSS. Mit den inline()-Formen fügst du Klassenkandidaten hinzu oder entfernst sie; sie funktionieren überall. Die Pfadformen geben die Vorlagendateien an, die nach Klassennamen durchsucht werden sollen. Nur der CLI durchsucht Dateien; Pfade werden derzeit noch nicht angewendet (siehe Verwendung der Pfade).

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

@source-Direktiven werden während der Kompilierung ausgelesen und aus der Ausgabe entfernt. Sie erscheinen nie im erzeugten CSS. Pfade müssen in Anführungszeichen stehen; einfache und doppelte Anführungszeichen sind zulässig.

Pfade, Globs und Negation

Die Pfadform akzeptiert ein Verzeichnis, ein Glob oder einen negierten Pfad. Die Direktiven werden zusammengeführt:

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

Verwendung der Pfade

Der Compiler speichert jede Pfad-Direktive in der Liste sources des Arrays, das TailwindPHP\compile() zurückgibt, als ['base' => …, 'pattern' => …, 'negated' => …] mit base aus der Kompilierungsoption base. Er liest selbst keine Dateien ein.

• tw::generate(), tw::compile() und TailwindCompiler kompilieren nur die Inhalte, die du übergibst. Pfad-Direktiven haben dort keine Wirkung.
• Der CLI liest sources ein, durchsucht in der aktuellen Version jedoch das Verzeichnis der Eingabedatei rekursiv nach jedem nicht negierten Pfad – unabhängig davon, was Pfad oder Glob vorgeben. not-Pfade werden vollständig übersprungen und schließen daher nichts aus (#8). Unter Was der CLI durchsucht findest du Details und eine derzeit funktionierende Verzeichnisstruktur.

Inline-Kandidaten

@source inline(...) erzwingt die Aufnahme von Klassen in die Ausgabe, selbst wenn sie in keiner durchsuchten Datei vorkommen. Das ist nützlich für Klassennamen, die zur Laufzeit dynamisch zusammengesetzt werden:

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

Inline-Kandidaten unterstützen auch Varianten:

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

Klammererweiterung

Inline-Muster erweitern Gruppen in geschweiften Klammern. So kannst du viele Kandidaten kompakt aufzählen:

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

Ignorierte Inline-Kandidaten

@source not inline(...) bewirkt das Gegenteil von inline(): Es entfernt passende Kandidaten aus der Ausgabe, selbst wenn sie in deinen Inhalten gefunden wurden. Auch hier funktioniert die Klammererweiterung:

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

Validierungsregeln

@source ist eine Anweisung, kein Block. Der Compiler weist Folgendes zurück:

• Eine Direktive mit Body – @source cannot have a body.
• Eine verschachtelte Direktive (zum Beispiel innerhalb von @media) – @source cannot be nested.
• Einen Pfad ohne Anführungszeichen – @source paths must be quoted.

/* Invalid — throws "`@source` cannot have a body." */
@source "./src" {
    .some-style { color: red; }
}

/* Invalid — throws "`@source` paths must be quoted." */
@source ./src;

Siehe die CLI für Builds mit Dateien und Imports zum Auflösen von @import und virtuellen Modulen.