Can I use tailwindcss with Hugo modules?

Hello there,

Using Hugo modules I have gotten rid of all the node modules, but I need to reinstall again to make use of tailwindcss. Is there anyone who is familiar with or has used Tailwind CSS and PostCSS with Hugo modules?

Thanks

There is:

2 Likes

You could try this :point_up:. It even supports Tailwind 3 and JIT as an experimental feature.

Here’s a basic setup for using it with Tailwind: Feature: How to use PostCSS and/or Tailwind WIP · Discussion #15 · theNewDynamic/huge · GitHub

Let me know if you have any questions.

3 Likes

Hi @maiki

have you tried this with tailwind v3 as things have been changed alot and there is JIT and some other plugins i cannot setup properly and i have to go back to node modules just for tailwind.

Any reccomendations to upgrade the share repo to tailwind 3 without breaking the jit etc.
thanks

Nope! :slight_smile: I just remembered that repo and announcement.

Sounds like @regis has you covered at Can I use tailwindcss with Hugo modules? - #3 by regis. :slight_smile:

Hi @maiki

that solution require you to use huge which is an another framework so i guess nodemodules is the only available solution at the time without the use of another framework

thanks

it is something i will defenetily consider later once i have learn to fully use hugo as seo is the one missing piece of puzzle which this service seems to solve.

thanks

With Huge or just Hugo, you will need to install tailwind as an npm module. There is no way around that. What Huge does is simply lift the complexity of asset processing, script/style bundling etc…

But in the end, you need to npm install tailwind and postcss. There is no way around that. And because the Hugo Pipe PostCSS method is not as advanced as js.Build, we can’t use Hugo to create the postcss and tailwind config files to feed em to the “machine”.

2 Likes