Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

is not valid windi css class

See original GitHub issue

Hi,

Thanks for making and maintaining Windi CSS. I got the following error when hovering my bg-neutral-lighter class:

bg-neutral-lighter is not valid windi css class (windi_invalid-class)

In my configuration file, I put

export default defineConfig({
  theme: {
    colors: {
      neutral: {
        dark: 'var(--ms-gray-800)',
        DEFAULT: 'var(--ms-gray-500)',
        light: 'var(--ms-gray-100)',
        lighter: 'var(--ms-gray-50)'
      },
    },
  },
})

Do you see any reason that leads my class not to be taken into account? Is it because I use CSS variables? If so, any workaround I could use?

Issue Analytics

State:
Created 2 years ago
Comments:13 (3 by maintainers)

Top GitHub Comments

3reactions

josh-israelcommented, Jun 30, 2022

Any updates on the issue?

1reaction

qunduscommented, Aug 6, 2022

I don’t think this issue is reproducible because it is environment and incident dependent. Anyway, apparently Windicss extension on VSCode switches language that renders .css files, for me it switched to PostCSS so i just changed it Windi and it worked.

Top Results From Across the Web

Windi CSS Intellisense for VS Code

Windi CSS IntelliSense enhances the Windi development experience by providing Visual Studio Code users with advanced features such as autocomplete, syntax ...

Configuring Windi CSS

Config File By default, Windi CSS will search for the configuration file under your project's root. Valid filenames are: windi.

Attributify Mode - Windi CSS

Next generation utility-first CSS framework.

Variants - Windi CSS

Targets the invalid pseudo-class. valid .${utility}:valid { ... } Targets the valid pseudo-class. optional .

Windi CSS CLI

-p, --prefix PREFIX Set the css class name prefix, only valid in compilation mode. The default prefix is 'windi-'. -o, --output PATH Set...