Duplicated semicolon in CSS file causes Tailwind CSS language server to not work

[alexander-doroshko]

I'll give very specific steps to reproduce the problem. At the same time I'd suggest treating this issue as a more general problem: the Tailwind CSS language server is too sensitive to the contents of the CSS file at the moment of the server initialization. See below for more thoughts on this. Thank you.

Steps: create a trivial project with two files, run npm install, open the project in the IDE (WebStorm or VS Code):
package.json

{
  "devDependencies": {
    "tailwindcss": "^4.1.7",
  }
}

style.css

@import 'tailwindcss';

@theme {
    --mono-foreground: green;;
}

.foo {
    @apply text-amber-600;
}

Problems:

• Tailwind intellisense doesn't work (code completion, color preview, hover, etc.). For example, try code completion after @apply in this CSS file
  • workaround: remove duplicated semicolon, save file, restart Tailwind LSP server
• Related usability problem: IDE doesn't give any hint about the fact and the reason of the server initialization failure
• Fixing the problem (removing the duplicated semicolon) doesn't help
  • removing the duplicated semicolon and restarting the server doesn't help either if the CSS file has not been saved
  • so all three steps are important: fix CSS file content, save file, restart the server

This example with a duplicated semicolon is only one of the examples that make the Tailwind server unhappy. So I wonder if a general solution of such kind of problems is possible. What I would expect in an ideal scenario:

• Tailwind CSS server should be tolerant to errors in the CSS file, most of errors shouldn't prevent from the server initialization
• If the server failed to initialize, user should be notified about this fact and the reason
• Once the reason is fixed (CSS file content updated), the server should start working without the need to restart it
• Ideally, saving the CSS file with corrected content should not be needed. Thanks to the LSP protocol, the server knows the unsaved file content

[functasti]

I couldn't reproduce this in a Vite (6.3.5) setup. When running the Vite dev server, it correctly logs [vite] Internal server error: Unexpected semicolon Plugin: @tailwindcss/vite:generate:serve to the terminal. Intellisense in the IDE also seems to work without any issues.

[alexander-doroshko]

@functasti Would you like to try the suggested steps to reproduce? A sample project with two small files.

[functasti]

@alexander-doroshko I'm not questioning the validity of your report, just pointing out that this doesn't seem to affect a Vite setup, which might be helpful for the team to take into account.

[thecrypticace]

This is a duplicate of #1121

It's a known issue right now. I have plans on how to improve this generally but it's going to require changes to Tailwind CSS itself.

[thecrypticace]

I'm gonna close this issue in favor of that one but I'm gonna do some thinking about this one because this is a pretty big DX pain point right now that I really need to solve.

[alexander-doroshko]

this is a pretty big DX pain point

That's true. Thanks for taking a look