vscode intellisense/eslint doesnt work with theme inside variant

[imranbarbhuiya]

What happened?

The way uniwind works with theme is a big unconventional. Is there a reason why it doesn't work the same way as tailwind does? that could make all tools work the same way. Or is there a way for the tools to work with this setup too? defining theme inside layer theme instead of @theme and also using variants for light/dark instead of .dark and leaving light as is

Steps to Reproduce

Clone the repo inside vscode with the extension and see all classes shows intellisense except the color ones inside variant. Same with the eslint plugin too.

Snack or Repository Link

https://github.com/imranbarbhuiya/uni-test

Uniwind version

^1.2.4

React Native Version

0.81.5

Platforms

Android, iOS

Expo

Yes

Additional information

• I've searched for similar issues in this repository and found none

[Brentlok]

After the metro server runs the internal css file inside uniwind is recreated to generate extra variants and to define color tokens inside the @theme

I don't think that tailwind has a way to define different theme for different variants, so that's why we do this like that

[imranbarbhuiya]

any solution to make the vscode extension & eslint plugin to work with current setup?

[Brentlok]

Just run the metro server so it generates new css and this should work

[imranbarbhuiya]

can u tell me the location of the generated css file? I cant find it

[Brentlok]

can u tell me the location of the generated css file? I cant find it

As I said:

internal css file inside uniwind is recreated

This is internal css file that you're importing in css -> @import 'uniwind';

[imranbarbhuiya]

im a bit confused, so can I make those tools work if I make my eslint to use the uniwind file from nodemodules (and same for the extension)? Not in pc so commenting without testing but if this works then my issue can be closed

[Brentlok]

It already uses that file, because you're importing it in your global.css, there is no need to change anything. Just run the metro server and start the app

[imranbarbhuiya]

vscode/eslint doesnt (or I mean it ofc imports but it doesnt registers those class names). I shared the repo above u can test, none of them load the colors I defined inside the variants and shows as unrecognised

[Brentlok]

[imranbarbhuiya]

thats so strange, do u have any special setup or something? same code part is giving both errors. First ss showing eslint error + vscode not showing css part, 2nd ss showing vscode working for other classes