Important
This plugin currently contains minimal features and is a work-in-progress
Provides a CLI plugin for Litestar to use Tailwind CSS via the Tailwind CLI.
pip install litestar-tailwind-cliConfigure and include the TailwindCLIPlugin in your Litestar app:
from pathlib import Path
from litestar import Litestar
from litestar.static_files import create_static_files_router
from litestar.contrib.jinja import JinjaTemplateEngine
from litestar.template.config import TemplateConfig
from litestar_tailwind_cli import TailwindCLIPlugin
ASSETS_DIR = Path("assets")
tailwind_cli = TailwindCLIPlugin(
use_server_lifespan=True,
src_css=ASSETS_DIR / "css" / "input.css",
dist_css=ASSETS_DIR / "css" / "tailwind.css",
)
app = Litestar(
route_handlers=[create_static_files_router(path="/static", directories=["assets"])],
debug=True,
plugins=[tailwind_cli],
template_config=TemplateConfig(
directory=Path("templates"),
engine=JinjaTemplateEngine,
),
)<head>
...
<link rel="stylesheet" href="/static/css/tailwind.css">
</head>After setting up, you can use the following commands:
litestar tailwind init: This command initializes the tailwind configuration and downloads the CLI if it's not already installed.litestar tailwind watch: This command starts the Tailwind CLI in watch mode during development. You won't have to use this if you setuse_server_lifespantoTrue.litestar tailwind build: This command builds a minified production-ready CSS file.
Note
Don't forget to update the content key in tailwind.config.js to specify your templates directories.
The TailwindCLIPlugin has the following configuration options:
src_css: The path to the source CSS file. Defaults to "css/input.css".dist_css: The path to the distribution CSS file. Defaults to "css/tailwind.css".config_file: The path to the Tailwind configuration file. Defaults to "tailwind.config.js".use_server_lifespan: Whether to use server lifespan. Defaults toFalse. It will start the Tailwind CLI in watch mode when you use thelitestar runcommand.cli_version: The version of the Tailwind CLI to download. Defaults to "latest".src_repo: The GitHub repository from which to download the Tailwind CLI. Defaults totailwindlabs/tailwindcss.asset_name: The name of the asset to download from the repository. Defaults totailwindcss.
For example, if you are using the repository https://github.com/dobicinaitis/tailwind-cli-extra/tree/main, you would set src_repo to "dobicinaitis/tailwind-cli-extra" and asset_name to "tailwindcss-extra".
litestar-tailwind-cli is distributed under the terms of the MIT license.