Issue Installing TailwindCSS Plugin: TailwindUI

I am building my Statamic site from the cool-writings template.

I am trying to use TailwindUI components by following their installation instructions: https://tailwindui.com/documentation.

Attempt 1:

  • Follow the instructions to NPM install TailwindUI and then add @tailwindcss/ui to the Tailwind plugin list.
  • TailwindUI components do not work. The installation and linking appears to not be working, even though I follow the instructions exactly.

Attempt 2:

  • Use the TailwindUI CDN
  • TailwindUI components load, but there is a strange conflict where items that rely on "hidden" TailwindCSS styling do not work (they are always hidden, instead of visible when not mobile)

Attempt 3:

  • Use the TailwindUI CDN
  • Comment out the following: <link rel="stylesheet" href="{{ mix src='css/tailwind.css' }}"> Result: TailwindUI components load, but the Markdown styling (and I imagine many other things) stop working.

Perhaps this issue should be reported elsewhere, such as the TailwindUI Github. However, given the nature of Statamic using TailwindCSS, I am confused why installing a plugin of TailwindCSS and adding it to the tailwind.config.jss file does not work.

Any thoughts on my struggle?

Lloyd

Answered by Erin Dalzell!
>>>>>>> Answered <<<<<<<
4 Replies
3 Followers