While working locally with my own project (jekyll serve --livereload), I run into situation when some tailwindcss classes didn't have any effect. But after restarting jekyll serve, same code had desirable effects.
I believe that this is due to: Just-in-Time compilation feature from Tailwind CSS.
TailwindCSS only includes used classes and all variations for them during compilation, but in a --livereload mode Jekyll doesn't recompile tailwind css.
More could be found here:
https://v2.tailwindcss.com/docs/just-in-time-mode
I see two possible solutions:
- Turn off JIT locally. If
livereload mode is enabled, we compile all classes for tailwindcss, if we disable JIT.
- Run tailwindcss on every reload, if
livereload mode is enabled.
While working locally with my own project (
jekyll serve --livereload), I run into situation when some tailwindcss classes didn't have any effect. But after restartingjekyll serve, same code had desirable effects.I believe that this is due to: Just-in-Time compilation feature from Tailwind CSS.
TailwindCSS only includes used classes and all variations for them during compilation, but in a
--livereloadmode Jekyll doesn't recompile tailwind css.More could be found here:
https://v2.tailwindcss.com/docs/just-in-time-mode
I see two possible solutions:
livereloadmode is enabled, we compile all classes for tailwindcss, if we disable JIT.livereloadmode is enabled.