Tailwindcss 4.1 + React Typescript STYLING IS IGNORED

[Sladerix]

I followed the documentation several times starting from scratch.
I do EVERYTHING (I think... at this point) but tailwind just do not work... styling is completely ignored... no errors... just nothing.

I attach short video link (too big to upload here) to show the procedure I do
https://limewire.com/d/iQuFz#707m5Cknb1

And a github repo with the code showed in the video:
https://github.com/Sladerix/buggy-tailwindcss-example

NodeJs version is 22.16.0
React version is 19.1.0

Thanks in advance

[rozsazoltan]

First of all, you're loading index.css twice. It doesn't matter which one you keep, but make sure to load it only once:

• https://github.com/Sladerix/buggy-tailwindcss-example/blob/main/index.html#L7
• https://github.com/Sladerix/buggy-tailwindcss-example/blob/main/src/main.tsx#L3

See more:

• https://tailwindcss.com/docs/installation/using-vite

Btw, your repo still works for me even like this - but regardless, importing it only once is definitely sufficient:

• https://stackblitz.com/github/Sladerix/buggy-tailwindcss-example?file=src%2FApp.tsx
  

Note: The video is either loading extremely slowly - or not loading at all - I closed it after half a minute. (from ~2Gb/s)

[Sladerix]

Hi thanks for the reply!

I knew that I was loading index.css twice, but I supposed that it was not a big deal... however I tried removing the one in the .html but it ended in no changes.

The thing that blew my mind are:

• "old" projects works like a charm... (vite 4.0.x)
• The project linked in the original post suddenly started rendering the styling just by switching two line of codes, but I'm NOT able to reproduce the correct steps to get it working by creating a project from scratch 🥴

New example that I could not get it working:
https://github.com/Sladerix/buggy-tailwind-project-2

Do you think that could be something related to a strange combination of Node installation on my MacBook Pro + Tailwind latest version + some dependency issues.... I do not know what to think at the moment.

P.S.
I tried opening the video link I posted, from other devices, and it loads superfast 🤷🏽‍♂️

[Sladerix]

Edit:
I just used the website you linked (stackblitz) to test the project, and it works there O_o ... same exact code.
So this must mean that there is some misconfiguration in my host system right??

I already tried different browser , cache cleaning, anonymous sessions…

What could it be? (I'm not experienced enough to suppose possible causes yet 😢)

[wongjn]

Try running git init in the root of your project.

[Sladerix]

Try running git init in the root of your project.

OH MY GOD 💀
I tried in one of the many "hello-world" I created, and it works!! This explains also why after publishing the projects to GitHub (only to let you all take a look) they fixed "themselves"...

Please let me understand the REASON of this 😵‍💫 and how was I supposed to know this.

Meanwhile, I try using it normally with ui.shadcn to check if everything actually works

[Sladerix]

Ok I found the answer (yours btw) to my previous question in this post:
#18405

Thank you again! This is so tricky... I think that something like this deserves to be pointed out in the Docs in a "Note box"