Aller au contenu

Plugins

Afficher au format Markdown Modifier sur GitHub Documentation de 3843abd

TailwindPHP fournit des portages PHP des plugins officiels TailwindCSS et expose une PHP native de plugin API. Les plugins enregistrent des utilitaires, des composants et des variantes ; ils sont chargés avec la directive @plugin dans votre CSS d’entrée. Les plugins intégrés sont des portages 1:1 de leurs équivalents JavaScript — mêmes sélecteurs et même sortie — implémentés en PHP plutôt qu’exécutés par Node. Une exception à ce jour : les modificateurs d’éléments du plugin de typographie (prose-headings:, prose-a:, …) dépendent des variantes de plugin, qui ne sont pas encore appliquées (#10).

Utiliser @plugin

Référencez un plugin par son nom avec @plugin. Les plugins intégrés utilisent le nom de leur paquet npm. Associez la directive à @import "tailwindcss/utilities.css"; pour émettre les classes du plugin dans la couche des utilitaires :

PHP
use TailwindPHP\tw;

$css = tw::generate([
    'content' => '<article class="prose prose-lg"><h1>Hello</h1><p>Content here</p></article>',
    'css' => '
        @plugin "@tailwindcss/typography";
        @import "tailwindcss/utilities.css";
    ',
]);

Plusieurs plugins peuvent être chargés ensemble, quel que soit leur ordre :

CSS
@plugin "@tailwindcss/typography";
@plugin "@tailwindcss/forms";
@import "tailwindcss/utilities.css";

@plugin ne peut pas être imbriquée dans une autre règle at (telle que @media) ; un nom de plugin non enregistré provoque une erreur.

Options des plugins

Transmettez des options à un plugin avec la syntaxe de bloc CSS après son nom. Les clés correspondent au tableau d’options du plugin :

CSS
@plugin "@tailwindcss/forms" {
    strategy: "class";
}

@plugin "@tailwindcss/typography" {
    className: "markdown";
}

Le plugin @tailwindcss/forms accepte strategy (base ou class) ; @tailwindcss/typography accepte className pour renommer la classe prose générée. Consultez les pages de chaque plugin pour la liste complète des options.

Plugins intégrés

Plugin Description
@tailwindcss/typography Les classes prose — des styles typographiques par défaut pour le texte enrichi. Consultez Typographie.
@tailwindcss/forms Des contrôles de formulaire réinitialisables et faciles à styliser. Consultez Formulaires.

Plugins personnalisés

Créez votre propre plugin en implémentant PluginInterface et en utilisant les méthodes de PluginAPI (addUtilities, matchUtilities, addComponents, addVariant, theme et bien d’autres). Enregistrez-le avec registerPlugin(new MyPlugin()) pour que le nom renvoyé par getName() soit reconnu dans une directive @plugin "my-plugin" :

PHP
use function TailwindPHP\registerPlugin;

registerPlugin(new MyCustomPlugin());

Consultez Plugins personnalisés pour l’interface, un exemple complet et la référence détaillée des méthodes PluginAPI.