Generating CSS

First, you will need to install all required node packages.

cd /path/to/project/app/design/frontend/Acme/default/web/tailwind/
npm install

Node.js version

We recommend using node version 16 or newer.

At the time of writing the minimum version depends on the Hyvä release:

Hyvä 1.3.6 and newer : node 16.0.0
Hyvä 1.3.0 - 1.3.5: node 14.0.0
Hyvä 1.2.x: node 14.0.0
Hyvä 1.1.x: node 12.13.0

Please note, the minimum required Node.js version for a any release of Tailwind CSS is available in the tailwindcss packages.json file at engines.node.

Generating CSS for production

You can generate the styles using the command

cd /path/to/project/app/design/frontend/Acme/default/web/tailwind/
npm run build-prod

Generating CSS during development

During development run

cd /path/to/project/app/design/frontend/Acme/default/web/tailwind/
npm run watch

This will start running the tailwind compiler continuously and any css classes added to templates in the purge configuration will be added to the styles.css file immediately.

Development Stylesheet not available

The development stylesheet with all classs, that could be generated when no JIT features where used (in Tailwindcss 2.x and Hyvä 1.1.x,) is no longer available, since the JIT mode is now the only option.