Tailwind CSS IntelliSense does not provide suggestions in a ReactJS project?

Question

I created a ReactJS project using create-react-project command. I npm installed tailwindcss and created a tailwind.config.js file.

Now to make my life easier I also installed an extension called Tailwind CSS IntelliSense and reloaded VSCode. The extension still does not give suggestions in my JavaScript files.

At first, i thought it is maybe because it works only with html extensions or that the reactjs files uses className for adding CSS classes as class keyword is reserved. So, I tried to edit index.html file but not suggestions in HTML files as well.

Please tell what else can I tryout?

Answer 1

Here's how to get Tailwind Intellisense to work with React files

1. Go to Tailwind CSS settings and add Javascript support "tailwindCSS.includeLanguages": { "plaintext": "javascript" }
2. Reload vscode

If this doesn't fix things, try using ctrl + space before adding a class name.

View image of Tailwind settings