arnolem/tailwindphp

TailwindPHP - use Tailwind CSS in your PHP projects (without npm)

Maintainers

Details

github.com/arnolem/tailwindphp

Homepage

Source

Issues

Installs: 1 006

Dependents: 0

Suggesters: 0

Security: 0

Stars: 11

Watchers: 2

Forks: 4

Open Issues: 2

2.2.0 2024-03-04 08:13 UTC

Requires

MIT 8806bb0164aff548f754ccd3f621e3d529eaf015

  • Arnaud Lemercier <arnaud.woop@wixiweb.fr>

symfonyphplaraveltailwindtailwindcss

This package is auto-updated.

Last update: 2025-05-04 10:47:06 UTC

README

TailwindPHP - use Tailwind CSS in your PHP projects (without npm)

Tailwind PHP allows you to compile TailwindCSS on the fly directly with PHP without dependencies (without npm or postcss).

Installing

IMPORTANT : Alpha version required linux x64.

PHP 8.0+ and Composer are required.

composer req arnolem/tailwindphp

Add execution rights

chmod +x ./vendor/arnolem/tailwindphp/bin/*

Configuration

1- create a tailwind.config.js config file

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ["./templates/**/*.twig"],
  theme: {
    extend: {},
  },
  plugins: [],
}

2-Add a link to the css route

<!-- base.html.twig -->
<!doctype html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="{{ path('css') }}" >
<!-- //... -->

3-Create a css route with TailwindPhp

<?php
// src/Controller/CssController.php
namespace App\Controller;

use Arnolem\TailwindPhp\TailwindPhp;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\Routing\Annotation\Route;

class CssController
{
    #[Route(path: 'style.css', name: 'css')]
    public function index(): Response
    {
        return new Response(
            TailwindPhp::build(),
            Response::HTTP_OK,
            ['Content-Type' => 'text/css']
        );
    }
}

Optional-Enable SCSS compilation

<?php
// src/Controller/CssController.php
namespace App\Controller;

use Arnolem\TailwindPhp\TailwindPhp;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\Routing\Annotation\Route;

class CssController
{
    #[Route(path: 'style.css', name: 'css')]
    public function index(): Response
    {
        TailwindPhp::enableScss(true);
        
        $scss = 'YOUR_SCSS_CONTENT with @apply ou theme() function';
        
        return new Response(
            TailwindPhp::build($scss),
            Response::HTTP_OK,
            ['Content-Type' => 'text/css']
        );
    }
}

Credits

  • Arnaud Lemercier is based on Wixiweb.

License

TailwindPHP is licensed under The MIT License (MIT).