Global Tailwind CSS styles: Selector ... is declared but it's never used (React TS CSS)

[karlhorky]

Describe the bug

In our app/global.css file (global Tailwind CSS styles), we define some reusable classes for multiple files, which are identified as being unused by the subtle ... decoration beneath the first .compactList in the screenshot:

app/global.css

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer components {
  /* 💥 Selector 'compactList' is declared but it's never used (React TS CSS) */
  .compactList li > ol,
  .compactList li > ul {
    @apply mb-0 mt-1;
  }
}

To Reproduce

Steps to reproduce the behavior:

1. Add the CSS above in a file such as app/global.css
2. Observe the error above

My config, for completeness:

  "reactTsScss.autoComplete": true,
  "reactTsScss.baseDir": "src",
  "reactTsScss.cleanUpDefs": [
    "node_modules/vite/client.d.ts",
    "node_modules/next/types/global.d.ts",
    "node_modules/react-scripts/lib/react-app.d.ts"
  ],
  "reactTsScss.codelens": false,
  "reactTsScss.cssAutoComplete": true,
  "reactTsScss.cssDefinitions": true,
  "reactTsScss.cssSyntaxColor": true,
  "reactTsScss.definition": true,
  "reactTsScss.diagnostics": true,
  "reactTsScss.peekProperties": true,
  "reactTsScss.references": true,
  "reactTsScss.tsCleanUpDefs": true,

Expected behavior

The React CSS modules VS Code extension should not report problems with global classes, especially not in CSS files which do not have .module. in the file extension.

Screenshots

Already included above

Desktop (please complete the following information):

• OS: macOS
• Version Sequoia 15.0.1 (24A348)

Additional context

--

[Viijay-Kr]

@karlhorky Hi 👋🏼, thanks for opening this one. Ya it's a valid annoying issue. I thought it could be a one liner, however for normal css files, some CSS language features such as variable completions, definitions etc are worth having. I will try to disable the reference and code lens features for these type of modules

[karlhorky]

Hmm, I like the idea of having the CSS language features like completions within these files too... does make sense.

If some features would be lost, maybe it's a better tradeoff to leave the ... decorations, hard to say... 🤔