Intellisense does not work with VSCode Remote Repositories

[ooliver1]

So I've installed and tried to use tailwindcss intellisense with my remote repository set-up, show output is on and says no config found if I remove the config file but with it the extension cancels loading in extension host logs.

All latest updates,

Version: 1.59.1 (user setup)
Commit: 3866c35
Date: 2021-08-19T11:56:46.957Z
Electron: 13.1.7
Chrome: 91.0.4472.124
Node.js: 14.16.0
V8: 9.1.269.36-electron.0
OS: Windows_NT x64 10.0.19042

[PudparK]

Having the same issue.
WSL2
Windows
Ubuntu
NextJS
It's also not showing as having a output command. e.g.
tailwindCSS.showOutput
And even though I do have a tailwind.config.js, I'm also getting this error:

Tailwind CSS: ENOENT: no such file or directory, open '\wsl.localhost\Ubuntu\home\pudpark\htx-talent\tailwind.config.js'

[f00f]

Similar issue here. My workspace is in the WSL 2 linux file system.
I open the folder \\wsl$\<distro>\home\<user>\<workspace>\ in Windows Explorer and then select "Open in VS Code" in the context menu.

Error message:

[Error - 16:59:26] Tailwind CSS: ENOENT: no such file or directory, open '/wsl$/<etc...>

I found that normalize-path in server.ts : init() changes the actual path to /wsl$/<etc> which is not valid on Windows.

[bradlc]

Hey @ooliver1. The extension is not compatible with virtual filesystems, which is what Remote Repositories uses. I am going to publish an update which will just disable the extension completely in these circumstances. Sorry about that!

@PudparK @f00f WSL is not related to Remote Repositories as far as I'm aware. I am keen to look into any issues there though, so please open a new issue, ideally with a link to a project that has the error, thanks!

[SupunSam]

Hey @ooliver1. The extension is not compatible with virtual filesystems, which is what Remote Repositories uses. I am going to publish an update which will just disable the extension completely in these circumstances. Sorry about that!

@PudparK @f00f WSL is not related to Remote Repositories as far as I'm aware. I am keen to look into any issues there though, so please open a new issue, ideally with a link to a project that has the error, thanks!

@bradlc But as many of us now moving into docker-based development this will be an issue clearly. Can we have anything else to do about this?

I mean in this case extension is looking for the following(one backslash at the beginning of the path) in the path from vs code:

\wsl$

But it should look for double backslashes. Because it's a network path.

\\wsl$

If you can fix that it will fix the issue. Or you can introduce a setting to do that. Some kind of a config file or something. Please don't disable it entirely for remotes. As a laravel developer, I know for a fact that many developers are migrating to docker based laravel sail from VMs. So this will be a huge blow to them if you disable it entirely for the remotes.

My Error:

[Error - 11:01:52 AM] Tailwind CSS: ENOENT: no such file or directory, open '\wsl$\Ubuntu-20.04\home\supundev\LK-EATS-app\tailwind.config.js' Error: ENOENT: no such file or directory, open '\wsl$\Ubuntu-20.04\home\supundev\LK-EATS-app\tailwind.config.js'

[bradlc]

@SupunSam Unless I am misunderstanding, this issue (#398) is regarding Remote Repositories, which has nothing to do with WSL. Following an update the extension will be disabled in virtual workspaces. Again, this is not related to WSL. The issue that you, @PudparK and @f00f are talking about is unrelated so please open a new issue with a reproduction. The extension works fine with WSL generally so I need to know more about your specific setup to be able to debug the issue. Hope that clears things up!

[SupunSam]

Yes @bradlc . You are right. I got it wrong. Extremely sorry about the mistake. My concern is regarding WSL when we open the code folder via network path. it works fine when we open directly from WSL using teminal.

Thank you very much for your explanation.

[f00f]

I opened a new issue here: #411

[bradlc]

Since v0.6.15 the extension is now disabled within virtual workspaces as it does not currently support those. Going to close this in favour of tailwindlabs/tailwindcss#7555

[zackha]

If you are working with nuxt3, you can try this.

Add the following configuration to your .vscode/settings.json file, so that Tailwind directives have proper autocomplete, syntax highlighting, and linting:

"tailwindCSS.experimental.configFile": ".nuxt/tailwind.config.cjs"
"files.associations": {
    "*.css": "tailwindcss"
}

detailed: link