django-crispy-forms / crispy-tailwind

A Tailwind template pack for django-crispy-forms
MIT License
329 stars 56 forks source link

CSS classes not found by tailwind watcher #144

Closed GitRon closed 6 months ago

GitRon commented 6 months ago

Hi there!

I'm a huge fan of crispy-forms since about 2012. I'm trying out Tailwind right now and was super delighted to find this template pack.

What I don't get: Tailwind automatically searches for class usages. If a class is not used, it's not being delivered. Since all the tailwind classes are hidden away in this package, how can I make tailwind understand that I need them? 😅

Currently, the results are as expected: The form gets rendered correctly HTML-wise but has no CSS. When I manually copy all templates to my source code, the classes are being found and the CSS is there. But that's obviously not a neat solution.

I found this post but first I don't want to disable JIT and secondly, I can't since tailwind v3.

I went throught the docs and issues but couldn't find a single reference to this major problem (that everybody has to have? 🤔).

What am I missing?

Thx a lot!
Ronny

GitRon commented 6 months ago

I just found this topic where they explain how to tell the watcher where to find the files:

https://saashammer.com/blog/render-django-form-with-tailwind-css-style/#jit

Another approach seems to be this package: https://www.joseferben.com/posts/django-4-form-tailwind-without-node-crispy/

If that's really the solution, it should go into the docs, right?

GitRon commented 6 months ago

Ok, I was being stupid after all. But where do I find this in the docs: https://django-crispy-forms.github.io/crispy-tailwind/getting_started.html?

I'd argue that this needs to be part of the installation part of the docs, not some FAQ since you can't opt-out of JIT mode anymore.

Supplemental: If you have more than one project and don't use any containers like docker, it would be aweseome we could set this ENV variable per-project - maybe via package.json?

carltongibson commented 6 months ago

I wrote a post on Using Django's Template Loader to Configure Tailwind — check it out. It allows you to dynamically set the template paths for TW's JIT, including templates from third-party packages like crispy-forms.

GitRon commented 6 months ago

Hi @carltongibson! Thanks, that looks truely amazing!

I think your pyhton code should go into this package and the JS part should go into the setup docs. I'll easen the setup for this package by a lot. What do you think?

Best from Cologne and merry Christmas! 🎄
Ronny

carltongibson commented 6 months ago

A link from the docs here to the article there would be about the right amount of work I'd suggest.

GitRon commented 6 months ago

Hi @carltongibson!

I've created a small PR: https://github.com/django-crispy-forms/crispy-tailwind/pull/145

What do you think?

Best from Cologne
Ronny

GitRon commented 6 months ago

Done: https://django-crispy-forms.github.io/crispy-tailwind/getting_started.html#installation