Make Hugo work with tailwindcss-jit

[bep]

https://github.com/tailwindlabs/tailwindcss-jit

[supjs]

Would be nice if this could be added sometime soon. I think the JIT really improves the PostCSS / Tailwind workflow and speeds it up quite significantly.

[metmac]

Using @praveenjuge's workaround for now, but definitely stoked to see this come to Hugo.

[sid-r-singh]

Using @praveenjuge's workaround for now, but definitely stoked to see this come to Hugo.

I am also using this workaround. Let's hope to see the integration in Hugo soon.

[mikewatkinsca]

Noting that Tailwind 3.0 alpha has landed and JIT mode has replaced the classic engine; given few breaking changes (other than this one) expect Tailwind 3 will hit release within a couple of months. FYI

Tailwind 3.0.0 alpha 1 release

[brycewray]

Noting that Tailwind 3.0 alpha has landed and JIT mode has replaced the classic engine; given few breaking changes (other than this one) expect Tailwind 3 will hit release within a couple of months. FYI

Tailwind 3.0.0 alpha 1 release

Now released:
https://tailwindcss.com/blog/tailwindcss-v3

[fywk]

Now released: https://tailwindcss.com/blog/tailwindcss-v3

Hi @brycewray, I've followed your guide on your blog to get JIT working. I couldn't get my site to build after upgrading to v3. I've altered npm scripts to get local server with watch mode working but no luck on building for production yet.

[ahaltindis]

Probably not very Hugo way but I am using tailwindcss CLI which keeps me away from Node.js/npm. Even though it has more pieces to put together, seems a bit more straightforward.

I have this simple bash script which runs hugo server and tailwindcss watcher together:

#!/bin/bash

$(cd themes/{theme} && tailwindcss -i assets/css/input.css -o assets/css/output.css --watch) &

hugo server 

For production, hooking tailwindcli before hugo build command.

[istr]

@bep I think that this could now be closed, as it is implemented in 0.112.*?

The documentation explicitly states that

The build.cachebusters configuration option was added to support development using Tailwind 3.x’s JIT compiler

https://gohugo.io/getting-started/configuration/#configure-cache-busters

The reference implementation works like a charm:
https://github.com/bep/hugo-starter-tailwind-basic

Or did I miss something that is still WIP?

[earthboundkid]

This issue should have been closed when Hugo 112 released.

[bep]

Closing, this is fixed (and actually works very well after a few tweaks).

[github-actions]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.