If there is a windicss.config.ts file in the project, the plug-in will be invalid

[jiangmaniu]

https://user-images.githubusercontent.com/50100681/119481846-be8ace80-bd85-11eb-994b-0a1eaf230a2e.mp4

If there is a windicss.config.ts file in the project, and Loading Config File: xxx text (as shown in the picture below) does not appear in the OUTPUT, it seems to indicate that the loading is not successful and Windi Css Intellisense will not work.

Under what circumstances would the windicss.config.ts file be loaded as shown below to make the plug-in work?

I tried to find out the problem, but unfortunately I couldn't find it. This problem has been bothering me and prevented me from developing efficiently through the plug-in in the project.😢

[alexanderniebuhr]

@jiangmaniu I can't reproduce it. Can you share a repo?

[alexanderniebuhr]

one thing I noticed, that VS Code has blue curly underline on vite-plugin-windicss. Are you sure it is installed with npm i?

[jiangmaniu]

Of course, I have installed the vite-plugin-windicss dependency package

The blue curve is because I installed the Code Spell Checker plug-in in vscode to check for incorrect English words (I am trying to learn English, but the current English level is not very good. The communication with you is through Google Translation. I am afraid that there will be low-level coding errors that English words are not fighting for, so I need this plugin to help me correct it.)

I tried to disable all vs code plug-ins and it worked well. The OUTPUT window at the bottom also showed that the configuration file was loaded.

So I think it is the conflict of vs code plug-in that caused this problem. When I searched Issuse, I found that #132 proposed the Auto Rename Tag plug-in will cause conflicts, but I tried it and it didn’t work for me. I disabled it. The plug-in still has this problem. So I think the conflicts caused by other vs code plugins. I am disabling or enabling the installed plugins one by one. I want to find this conflicting plugin, but unfortunately, I have been searching for a day and haven’t found any relevant Conflicting plugin.

[alexanderniebuhr]

please give me a list of plugins you use. screenshot is ok as well!

[alexanderniebuhr]

And if you can confirm it only breaks with .ts? .js files work fine?

[jiangmaniu]

My project uses TypeScript so I only tested .ts. I just tested the .js file, and it seems that the plugin will not work.

The following is a picture of the list of plugins installed by my `vs code`


[alexanderniebuhr]

thanks. we are checking

[HenryC-3]

Hi, @alexanderniebuhr @jiangmaniu , I met the same problem.

it can be reproduced in vite + windicss or vuecli + windicss project by following steps

1. windicss-vite-html-demo
2. disable all plugins in the workspace except WindiCSS IntelliSense and Auto Rename Tag plugin
3. reload window (IntelliSense works fine)
4. modify windi.config.ts (IntelliSense doesn't work)

I fixed this problem by disabling Auto Rename Tag plugin, then reloading the vscode window

https://user-images.githubusercontent.com/41246463/119538200-738cad80-bdbd-11eb-9946-8e639360c1af.mov

[alexanderniebuhr]

@HenryC-3 thanks for letting us know. But it seems that @jiangmaniu does not use Auto Rename Tage. @HenryC-3 your issue looks more like #132

[amythos]

hi, @alexanderniebuhr i have disable all my vscode extensions except WindiCSS IntelliSense , and then reenable those extensions like @jiangmaniu does. and now WindiCSS IntelliSense works for me.

and i found the problem is the context of windi.config.ts from windicss configuration example, maybe WindiCSS IntelliSense got some error when loading the default config, but without log the errors.

[alteredorange]

I had a similar problem with the plugin. One day intelli-sense stopped working and I couldn't for the life of me figure it out. As far as I can tell, the plugin prefers a .js file. I had .ts and .cjs on different projects, and it was working, but then stopped. Adding a blank windi.config.js fixed the problem immediately. Maybe the plugin prefers .js and has a hard time picking up other extensions? Right now I have my actual config (windi.config.cjs), and a copy of that as a .js file so intellisense will work.

[leosin]

+1 in version 3.0.12

[ycs77]

@HenryC-3 Disable Auto Rename Tag plugin is work for me, thanks!

[voorjaar]

v0.18.3 should fix this. and also added more detailed log info.

[voorjaar]

found another bug, if enable auto rename tag, and require some plugin like typography windi plugin will crash.

[laozei6401]

Disable automatic renaming to take effect

[jbaubree]

In my case, i had same issue and i fixed it directly importing Windicss in my package.json. I think vite-plugin-windicss does not link well windicss for vs-code. You can also try to export your windicss config file without defineConfig(), it will be better because vscode will not search anything from 'windicss'.

Hope that will help :)