arnolem / tailwindphp
TailwindPHP - 在PHP项目中使用Tailwind CSS(无需npm)
2.2.0
2024-03-04 08:13 UTC
Requires
- php: >=7.4
- scssphp/scssphp: ^1.11
- symfony/process: >=6.3
README
TailwindPHP - 在PHP项目中使用Tailwind CSS(无需npm)
Tailwind PHP 允许您直接使用PHP即时编译TailwindCSS,无需依赖(无需npm或postcss)。
安装
重要:Alpha版本需要Linux x64。
需要PHP 8.0+和Composer。
composer req arnolem/tailwindphp
添加执行权限
chmod +x ./vendor/arnolem/tailwindphp/bin/*
配置
1- 创建一个tailwind.config.js
配置文件
/** @type {import('tailwindcss').Config} */ module.exports = { content: ["./templates/**/*.twig"], theme: { extend: {}, }, plugins: [], }
2- 添加到css路由的链接
<!-- 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- 使用TailwindPhp创建css路由
<?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'] ); } }
可选-启用SCSS编译
<?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'] ); } }
致谢
- Arnaud Lemercier基于Wixiweb。
许可协议
TailwindPHP遵循MIT许可协议(MIT)。