TailwindPHP
A TailwindCSS 4.x átültetése PHP nyelvre. PHP nyelven generál Tailwind segédprogram-CSSeket, Node.js és buildlépés nélkül. Tartalmazza a következőket: cn(), tailwind-merge, CVA, a tipográfiai és űrlapbővítményeket, valamint egy CLI.
composer require tailwindphp/tailwindphpLegújabb kiadás v1.7.0 MIT PHP 8.2+
use function TailwindPHP\merge;
merge('px-2 py-1 bg-red-500', 'px-4 bg-blue-500');
// => 'py-1 px-4 bg-blue-500'
// Conflict resolution is variant-aware
merge('hover:bg-red-500', 'hover:bg-blue-500');
// => 'hover:bg-blue-500'A gyakorlatban
Adj át jelölést és opcionális bemeneti CSS-ot egyetlen PHP hívásnak, és stíluslapot kapsz vissza.
PHP generálása CSS alapján
A tw::generate() átvizsgálja a jelölést osztálynevek után, és csak az ezekhez szükséges CSS értékeket adja vissza. A második argumentum bemeneti CSS-ot fogad, így az @theme-ban meghatározott színből segédprogram lesz.
A cn() osztálykarakterláncokat állít össze, és feloldja az Tailwind ütközéseket, így az utolsó ütköző segédprogram érvényesül.
use TailwindPHP\tw;
$css = tw::generate(
'<div class="bg-brand p-4">Hello</div>',
'@import "tailwindcss"; @theme { --color-brand: #3b82f6; }'
);
// .bg-brand now resolves to var(--color-brand)use function TailwindPHP\cn;
cn('px-2 py-1', 'px-4'); // 'py-1 px-4'
cn('btn', ['btn-primary' => true]); // 'btn btn-primary'Tisztán PHP-alapú
Nincs szükség Node.js-re vagy buildlépésre. PHP 8.2+ verzión fut, a szokásos mbstring és ctype bővítményekkel. Futtasd a composer require parancsot, és már használhatod is.
A TailwindCSS v4.3.3 verzióját követi
A Tailwind v4.3.3 átültetése, ugyanazokkal a segédprogramokkal, variánsokkal és direktívákkal. Az Tailwind ismert eltéréseit dokumentáltuk.
Több mint 4,400 teszt
A kimenetet a TypeScript forrásból kinyert TailwindCSS saját tesztcsomagjaival ellenőrizzük, és minden push alkalmával újra lefuttatjuk.
Minden segédprogram és variáns
A teljes segédprogramkészlet és minden variáns: rámutatás, fókusz, reszponzív megjelenítés, sötét mód, konténerlekérdezések és tetszőleges értékek.
CSS direktívák
@import, @theme, @apply, @utility, @custom-variant, @layer, @plugin és @source: elemzésük és feloldásuk PHP nyelven történik.
Generálás futás közben
Generálj menet közben segédprogram-CSSeket a következőkből: HTML, adatbázistartalom vagy sablonváltozók. Nincs szükség buildlépésre.
Minden benne van
cn(), merge(), join() és variants(): clsx, tailwind-merge és a CVA PHP nyelvre átültetett változata, további csomagok nélkül.
Bővítmények
A @tailwindcss/typography és a @tailwindcss/forms PHP nyelvre átültetett változata, valamint egy PHP bővítmény API saját segédprogramokhoz és komponensekhez.
CLI
A bin/tailwindphp bemeneti CSS fájlból készít stíluslapot a -i, -o, --watch és --minify kapcsolókkal.
A téma vizsgálata
Olvasd ki közvetlenül a PHP eszközből bármely osztály nyers és számított tulajdonságértékeit, színeit, töréspontjait és térközeit.
Gyorsítótár és tömörítő
A beépített CSS tömörítő és a TTL-lel működő fájlgyorsítótár felgyorsítja az ismételt buildeléseket, és csökkenti a kimenet méretét.
WordPress- és PHP-keretrendszerek
Készíts Tailwind-alapú témákat és bővítményeket Node.js nélkül a technológiai készletben. A TailwindPHP egyetlen Composer függőség.
Miért TailwindPHP?
Egy futtatókörnyezet éles környezetben
Egy PHP projekt, amely bevezeti a Tailwind használatát, rendszerint a Node.js bevezetésével is jár, továbbá npm telepítést, valamint buildlépést igényel a CI-ben és a Docker környezetben. A TailwindPHP ehelyett a CSS elemet a PHP folyamaton belül fordítja le.
CSS futás közben ismert tartalomhoz
Az adatbázisból származó jelölés, a felhasználói bemenet vagy a sablonváltozó közvetlenül átadható a tw::generate() számára, amely csak az osztályaihoz szükséges CSS értékeket adja vissza.
Ellenőrizve egy rögzített Tailwind-kiadással
A teszteseteket a repóban rögzített Tailwind forrásából nyerjük ki, majd a PHP kimenetén futtatjuk le, így az eltérések meghiúsítják a CI-folyamatot. A 1.7.0 kiadást a következővel ellenőriztük: Tailwind v4.3.3, 4,427 teszt használatával.
Oldalankénti CSS egyetlen fordítóból
Fordítsd le egyszer a témát a tw::compile() segítségével, majd hívd meg a generateExact()-et minden oldalhoz. Minden hívás azt adja vissza, amit az oldal hideg tw::generate() fordítása eredményezne, a téma újbóli elemzése nélkül.
Összehasonlítás
A Tailwind Labs saját módszereket kínál a Tailwind CSS összeállítására. Így különbözik a TailwindPHP.
| Eszköz | Amiben jó | Különbségek TailwindPHP-hoz képest |
|---|---|---|
| Tailwind CLI (@tailwindcss/cli) | Amiben jóA Tailwind saját parancssori eszköze, amely a npm csomagból telepíthető. Átvizsgálja a HTML fájlokat, komponenseket és sablonokat osztálynevek után kutatva, majd a megfelelő stílusokat egy statikus CSS fájlba írja. | Különbségek TailwindPHP-hoz képestA TailwindPHP a PHP belsejében fordít, Node.js és npm telepítése nélkül. Egy rögzített Tailwind kiadást követ (1.7.0 alatt v4.3.3), saját benchmarkja pedig azt mutatja, hogy az eredeti TypeScript gyorsabban végzi el az alacsony szintű műveleteket. |
| Tailwind önálló CLI | Amiben jóA Tailwind CLI önálló végrehajtható fájlként érhető el azoknak a projekteknek, amelyek a Node.js telepítése nélkül szeretnék használni. | Különbségek TailwindPHP-hoz képestA végrehajtható fájl külön bináris, amely buildlépésként fut. A TailwindPHP egy Composer csomag, amelyet a PHP kódod hív meg, így kéréskor is generálhat CSS-t adatbázistartalomból vagy sablonváltozókból. |
| Tailwind Play CDN | Amiben jóA böngészőben futó szkriptcímke a Tailwind használatával buildlépés nélkül próbálható ki. A Tailwind dokumentációja szerint fejlesztésre készült, éles környezetben nem használható. | Különbségek TailwindPHP-hoz képestA TailwindPHP használatához sincs szükség buildlépésre, de a szerveren, PHP nyelven generálja a CSS-t, és karakterláncként adja vissza, például egy stíluslapba íráshoz. |
Források, bejelölve
Kérdések és válaszok
Rövid válaszok a TailwindPHP dokumentációjából.
A 1.7.0 kiadás a Tailwind CSS v4.3.3 verzióját követi. A tesztcsomagokat ismét kinyertük az adott verzióhoz.
A kimenetet a Tailwind saját tesztfájljaiból kinyert esetekkel ellenőrizzük. A 1.7.0 változásnaplója néhány szerializálási eltérést rögzít; például a .p-0 megőrzi a padding: 0px értéket, míg a referencia-CLI a padding: 0 értéket adja ki.
Nem. A bővítmények PHP: a tipográfiai és űrlapbővítmények át vannak ültetve, saját bővítményt pedig a PHP bővítmény-API alapján írhatsz, majd regisztrálhatod a registerPlugin() segítségével. A nem regisztrált @plugin név hibát okoz.
A projekt PHP 8.4.5 rendszeren és egy Apple M1 gépen végzett benchmarkja szerint a teljes oldalgenerálás oldalanként nagyjából 14 ms-ot vett igénybe. Ismételt bemenet esetén a fájlgyorsítótár kihagyja a fordítást, a generateExact()-szel használt, hosszú élettartamú fordító pedig újra felhasználja az elemzett témát.
Nem. A IntelliSense, az automatikus kiegészítés, az osztályrendezés és a forrástérképek szándékosan kimaradtak. A TailwindPHP csak CSS-t generál.
PHP 8.2 vagy újabb verzió, ctype és mbstring bővítményekkel. A composer.json deklarálja a PHP verziót, a CI pedig PHP 8.2, 8.3 és 8.4 verzión futtatja a tesztcsomagot.
Telepítsd a csomagot a Composer segítségével, majd kövesd az első lépéseket bemutató útmutatót, hogy elkészítsd első stíluslapodat a következőből: PHP.