Tailwind language server shows errors #2213
Comments
|
It looks like the tailwind LS has a troubleshooting section here: https://github.com/tailwindlabs/tailwindcss-intellisense#troubleshooting and some available configuration above. You can also run in verbose mode with the |
|
I got the same error
[[language]]
name = "tailwindcss"
scope = "source.css"
injection-regex = "(postcss|css)"
file-types = ["css"]
roots = ["tailwind.config.js","tailwind.config.cjs"]
comment-token = "//"
language-server = { command = "tailwindcss-language-server", args = ["--stdio"] }
indent = { tab-width = 2, unit = " " }Log |
|
any info for this? not working and even broke svelte syntax highlighting and completions my languages.toml file: [[language]]
name = "tailwind"
scope = "source.svelte"
file-types = ["svelte"]
roots = ["tailwind.config.js","tailwind.config.cjs"]
language-server = { command = "tailwindcss-language-server", args = ["--stdio"] } |
This comment was marked as spam.
This comment was marked as spam.
|
I looked into this some, it appears that the tailwindcss language server expects the userLanguages: params.initializationOptions.userLanguages
? params.initializationOptions.userLanguages
: {},Tailwindcss never checks to make sure My configuration file that does not produce that error looks like this [[language]]
name = "tailwindcss"
scope = "source.css"
injection-regex = "(postcss|css|html)"
file-types = ["css"]
roots = ["tailwind.config.js","tailwind.config.cjs"]
language-server = { command = "tailwindcss-language-server", args = ["-vvv", "--stdio"] }
indent = { tab-width = 2, unit = " " }
config = { } # <---- this is the partial fixBut even though the error went away (and the logs show the language server working), it's still not giving completions. (The server keeps returning I haven't figured the issue out, but I thought I would write down what I've discovered so far. Update: In a Update 2: I solved it! Tailwindcss determines which type of file you are in based on the [[language]]
name = "tailwind-svelte"
scope = "source.svelte"
file-types = ["svelte"]
roots = ["tailwind.config.js","tailwind.config.cjs"]
language-server = { language-id = "svelte", command = "tailwindcss-language-server", args = ["--stdio"] }
config = { }You need to modify each language tailwindcss works with and overwrite it with tailwindcss and the correct [[language]]
name = "svelte"
scope = "source.svelte"
file-types = ["svelte"]
roots = ["tailwind.config.js","tailwind.config.cjs"]
language-servers = [ "tailwindcss-svelte", "svelteserver" ]
[language-server.tailwindcss-svelte]
language-id = "svelte"
command = "tailwindcss-language-server"
args = ["--stdio"]
config = { }
[[language]]
name = "css"
scope = "source.css"
file-types = ["css", "postcss"]
language-servers = [ "tailwindcss-css", "vscode-css-language-server" ]
[language-server.tailwindcss-css]
language-id = "css"
command = "tailwindcss-language-server"
args = ["--stdio"]
config = { }
[[language]]
name = "html"
scope = "text.html.basic"
file-types = ["html"]
language-servers = [ "tailwindcss-html", "vscode-html-language-server" ]
[language-server.tailwindcss-html]
language-id = "html"
command = "tailwindcss-language-server"
args = ["--stdio"]
config = { } |
|
Once tailwindlabs/tailwindcss-intellisense#656 is released the config will be able to be empty without causing tailwind to crash, which fixes this bug. |
|
Any news on this. Should it work now? I am not able to use this. |
|
Anyone do this with tsx files ? |
|
@arnm Did you found any solutions? |
|
Now that it has been merged did someone experiment already with TSX and Tailwind? [[language]]
name = "typescript"
roots = ["tailwind.config.js", "tailwind.config.cjs"]
language-servers = [ "tailwindcss-typescript", "typescript-language-server" ]
[language-server.tailwindcss-typescript]
language-id = "typescript"
command = "tailwindcss-language-server"
args = ["--stdio"]
config = { } |
|
I'm trying with (with the master branch and it's not working at all. Curious if anyone can share a working configuration). |
Try to add in: |
|
Ive tried and infortunately it didnt work for me |
|
@Philipp-M are we doing something wrong? |
|
Don't have much time right now...
What may give some insight is running helix with the verbose flag ( For tsx the |
|
Thanks for your comment! Just to add a couple of elements
I'm going to try another lsp that would benefit from being run side by side with another one. I'll report if I can make that one work. |
|
Tested the following configuration in [[language]]
name = "svelte"
language-servers = ["svelteserver", "tailwindcss"]
roots = ["tailwind.config.cjs", "tailwind.config.js"]
[language-server.svelteserver]
command = "node_modules/@tailwindcss/language-server/bin/tailwindcss-language-server"
[language-server.tailwindcss]
language-id = "svelte"
command = "node_modules/svelte-language-server/bin/server.js"
args = ["--stdio"] |
|
TailwindLSP was working for me on node I tried to stop these two requests and insert default values(from other editors) and it works(Linux) for React, Vue and Svelte 😃
npm #other language servers and languages
...
# tailwind react
[language-server.tailwindcss-react]
language-id = "javascriptreact"
command = "hx-tw"
config = { }
args = ["--stdio"]
timeout = 3
# tailwind vue
[language-server.tailwindcss-vue]
language-id = "vue"
command = "hx-tw"
args = ["--stdio"]
timeout = 5
[[language]]
name = "vue"
scope = "source.vue"
file-types = ["vue"]
roots = ["package.json", "tailwind.config.js","tailwind.config.cjs", ".prettierrc.json"]
language-servers = ["volar","tailwindcss-vue"]
injection-regex = "vue"
formatter = {command = "prettier", args = ["--parser", "vue"]}
auto-format = true
[[language]]
name = "tsx"
language-servers = ["tailwindcss-react", "tsreact"]
roots = ["tailwind.config.js","tailwind.config.cjs", ".prettierrc.json"]
[[language]]
name = "jsx"
language-servers = ["tailwindcss-react", "tsreact"]
roots = ["tailwind.config.js","tailwind.config.cjs", ".prettierrc.json"]
...
Until helix client doesn't respond to |
|
@uros-5 I am using your patched LSP and it works! Well kinda, the completions are kinda messed up for me. As soon a I enter the first hyphen in my class, it just displays random other classes. Anybody else got that issue? |
I had that too on previous version of helix. Try updating to the latest or build from source. |
|
@uros-5 ah thanks! I am currently using the the copilot MR branch so updating might be a bit tricky, but that certainly explains it. |
|
I started using your patched LSP too, @uros-5 and as @MatthiasGrandl said it's working for me too. I've found one curious behavior though, which is that if the tailwind LSP is the first in the list, completions (from both TW-LSP and Edit: I just realized that the TW-LSP should show info when using |
We talked about that in (this) issue and also here. |
This did not work for me, I am not getting any hover ro tailwinds classes. |
Have you tried to build from source? |
I did build your fork from source. EDIT: |
Please read previous comments.. It's not that hard. |
|
@tcoopman did you manage to make it work with elixir? |
this is not intended to be upstreamed. it's a hack to get jsx/svelte + tailwind to work together related to helix-editor#2213 (comment) i realized afterwards that https://github.com/uros-5/helix/tree/just-hover exists which implements something really similar
|
i ended up implementing something similar to @uros-5 (before realizing it had been done before) in https://github.com/catdevnull/helix/tree/multiple-lsp-hover. thanks! uros' implementation is better for the jsx/svelte + tailwind use case because it just pushes the result of the first server that returns. but mine "tries" (but probably fails, didn't test) to get hovers from all servers to merge them all together in the same hover window, which could be helpful for some weird use case where you want to see multiple hovers from multiple servers. |
|
@cmnstmntmn no, not yet. But I can't immediately find out why it doesn't work. I've discussed about it a bit here as well: https://elixirforum.com/t/getting-heex-and-h-working-in-nvim-with-astronvim/54779/30?u=tcoopman |
|
uh, did you test this? i can't get it working with |
|
seems like the other pr to fix tailwind with helix hasn't been released yet: tailwindlabs/tailwindcss-intellisense#803 try the insiders command recommended in this pr |
|
the server is up and running both hx-tw and the latest wanted to see if anyone else is using the standalone cli here and has a similar problem with nulls being returned on hover/completion |
|
@swlkr maybe you want to move this into a discussion. I'm happy to help because I have working version for javascript/typescript with tailwind running with |
|
Hi, I just used tailwind for the first time today. There is a lot of chat about broken things being fixed here, and it all seems out of date. Can I use tailwindcss-intellisense language server today in Helix on the latest master? If so, exactly what do I need to add to my config? I just want to see documentation and get auto-completion in my HTML. Thanks :) |
|
No not yet. The PR for the fixes on tailwind-intellisense has been merged, but no new release has been made. |
|
you can use the insiders build: |
|
I have made a pull request to get Tailwind into Helix officially, please could everyone involved in this thread hop over and have a look as you all have more experience than me! :) |
|
68fce3e was merged... I suggest updating your configs to avoid cruft and bloat. Keep it clean :) |
|
In case anyone else lands here wondering why it still doesn't work despite all the above, for me the trick was installing the Then (because the config for the language server is built in) all you have to do is add it to the list for your file type: [[language]]
name = "tsx"
language-servers = [ "typescript-language-server", "tailwindcss-ls" ]Before installing |
|
To be sure, the fix was upstreamed on master. They mentioned they were about to do a release this week, but its still pending. |
|
I can't make this work with svelteserver, is either one or the other depending on which one is declared first in language-servers. Edit:
Applied the changes in this commit manually since master is way ahead and recompiled, now it works fine. |
|
For anyone still following the latest version of tailwindcss-language-server was just released (with the fix needed to make this work properly, version 0.0.14). |
Can confirm v0.0.14 of @tailwindcss/language-server works (atleast for svelte files)! One issue I am noticing though is that the hyphens in Tailwind's class names is causing the LSP suggestions to break. Here is my working config: [[language]]
name = "svelte"
indent = { tab-width = 4, unit = "\t" }
auto-format = true
roots = ["svelte.config.js"]
language-servers = ["tailwindcss-ls", "svelteserver"]Here are screenshots of that hyphen issue, also for some reason certain html elements don't have syntax highlighting on the opening tag, oh well. |
|
Could you file an issue upstream ? There is a new developper on the project that is very responsive. If its a simple fix, it will likely be taken care of. |
|
The hyphen stuff is a helix problem that will be fixed with the event system |
|
Has anyone got Tailwind working with elixir/phoenix. I seem to get this logs. Here is my config with Lexical LS. Lexical is working however Tailwind does not. I have installed tailwind-language-server using |
|
@sukidhar Your language-id needs to be under the language definition, not the language-server definition. Example: |
|
@jelkand did you ever to manage to get tailwind working with elixir (so inside |
I haven't tested this extensively, but providing |
|
awesome, that works with |
|
yes, I have tested it works!!! 🚀 that is really helpful |
[[language]]
name = "rust"
auto-format = true
language-servers = ["rust-analyzer", "tailwindcss-ls"]
roots = [
"Cargo.toml",
"Cargo.lock"
]
[language.auto-pairs]
'(' = ')'
'{' = '}'
'[' = ']'
'"' = '"'
'`' = '`'
[language-server.tailwindcss-ls]
command = "tailwindcss-language-server"
args = ["--stdio"]
config = {userLanguages = { rust = "html", "*.rs" = "html" } }
[language-server.rust-analyzer.config]
inlayHints.bindingModeHints.enable = false
command = "rust-analyzer"
check.command = "clippy"
inlayHints.closingBraceHints.minLines = 10
inlayHints.closureReturnTypeHints.enable = "with_block"
inlayHints.discriminantHints.enable = "fieldless"
inlayHints.lifetimeElisionHints.enable = "skip_trivial"
inlayHints.typeHints.hideClosureInitialization = false
procMacro = { ignored = { leptos_macro = [
"server", "component"
] } }
[language.formatter]
command = "rustfmt"I am trying to get this working with Leptos but it fails with: 2024-06-16T22:23:24.562 helix_term::application [ERROR] Ignoring unknown notification from Language Server: protocol error: InvalidParams: Invalid params: missing field `message`.
2024-06-16T22:23:40.556 helix_lsp::transport [ERROR] tailwindcss-ls err: <- StreamClosed |
and others
Helix showing me this:
And there is my languages.toml
The text was updated successfully, but these errors were encountered: