pytailwindcss-extra

Use Tailwind CSS with daisyUI without Node.js and install it via pip.

An extension of pytailwindcss with tailwind-cli-extra to enable daisyUI support.

Why

Tailwind CSS is notoriously dependent on Node.js. If you're a Python developer, this dependency may not be welcome in your team, your Docker container, or your inner circle.

The Tailwind CSS team recently announced a new standalone CLI build that gives you the full power of Tailwind CLI in a self-contained executable — no Node.js or npm required.

However, installing such a standalone CLI isn't as easy as running npm install, the installation command for Node.js.

So the user timonweb created the pytailwindcss package, which allows you to install the standalone Tailwind CLI with a simple pip command.

While this package works well, there is one particular problem. Due to the binary nature of the Tailwind CLI, only the official Tailwind CSS plugins are included and other plugins, especially the very popular daisyUI plugin, cannot be installed (see Caveats).

Although the problem cannot be solved completely, daisyUI is very useful, not only for me, so the user dobicinaitis offers tailwind-cli-extra, a Tailwind CLI binary patched with daisyUI. Using this binary, pytailwindcss-extra extends pytailwindcss and provides the Tailwind CLI with the daisyUI plugin for the Python ecosystem.

Get started

1. Install tailwindcss-extra via pip by executing the following command:

   pip install pytailwindcss-extra
   

2. The tailwindcss-extra command should now be available in your terminal. Try to run it:

   tailwindcss-extra
   

   If the installation was successful, you should see the message about binary being downloaded on the first run. When download is complete, you should see the help output for the tailwindcss-extra command. Use it to create a new project or work with an existing Tailwind CSS project.

3. Let's create a new project. Go to the directory where you want to create your Tailwind CSS project and initialize it by creating an CSS file e.g. input.css:

   @import "tailwindcss";
   @plugin "daisyui";
   

4. Start a watcher by running:

   tailwindcss-extra -i input.css -o output.css --watch
   

5. Compile and minify your CSS for production by running:

   tailwindcss-extra -i input.css -o output.css --minify
   

You got it. Please refer to official Tailwind documentation for more information on using Tailwind CSS and its CLI.

Caveats

It's not all roses, though. Giving up Node.js means you won't be able to install plugins or additional dependencies for your Tailwind CSS setup. At the same time, that might not be a dealbreaker. You can still customize Tailwind CSS via your CSS file. And the standalone build also comes with all official Tailwind CSS plugins like @tailwindcss/aspect-ratio, @tailwindcss/forms, @tailwindcss/line-clamp, @tailwindcss/typography and of course daisyUI. So in 90% of Tailwind CSS usage cases you should be covered, and the setup is so simplified now.

Here is what the Tailwind CSS team says about going the standalone Tailwind CSS route:

If you’re working on a project where you don’t otherwise need Node.js or npm, the standalone build can be a great choice. If Tailwind was the only reason you had a package.json file, this is probably going to feel like a nicer solution.