I'm facing an issue with Tailwind CSS IntelliSense in Visual Studio Code (VSCode). The problem is that I'm not getting any CSS-related suggestions while working with Tailwind CSS. My Tailwind CSS works perfectly fine, and I have the tailwind.config.js file in my project directory, along with Tailwind CSS installed both globally and locally.
The issue is consistent across different projects, whether it's a Next.js or React project. Surprisingly, I receive JS-related suggestions (as seen in the provided image), but no CSS-related ones. image of my suggestions tab
I have tried various solutions posted in Stack Overflow and other sources to fix the issue. Here's what I've tried:
Tweaking the settings.json file in VSCode: I added "strings": true
to ``editor.quickSuggestions```` and
"includeLanguages": { "html": "html", "javascript": "javascript", "css": "css" } to "tailwindCSS"
in the settings.json file.
Installing relevant extensions: I added "HTML CSS Support", "CSS Peak,"
and "IntelliSense for CSS class names in HTML"
extensions to my VSCode setup.
Reinstalling IntelliSense and VSCode: I uninstalled and reinstalled the "Tailwind CSS IntelliSense"
extension and even reinstalled VSCode itself.
Using the ```Ctrl + Space`` shortcut: I tried the suggested keyboard shortcut to trigger IntelliSense suggestions but only got JS-related suggestions.
Screenshot of Output Tab for Tailwind CSS IntelliSense: output tab
Below is the content of my settings.json file. Despite trying these steps, Tailwind CSS IntelliSense continues to remain unresponsive.
Any assistance in resolving this long-standing issue would be highly appreciated, as it would significantly boost my productivity as a new front-end developer.
settings.json contents:settings.json