Support for tailwind styling syntax.

[kkibria]

I have been using tailwind for styling in svelte.

The style syntax checker flags certain tailwind directives. It would be nice if the syntax checker can accommodate tailwind directives in styles section.

[swyxio]

can you try adding <style type="text/scss">? if you have the preprocessor setup correctly it should "just work".

https://github.com/sveltejs/language-tools/tree/master/packages/svelte-vscode#generic-setup

[kkibria]

Thank you, it is working with the style type added.

…

On Wed, Jun 10, 2020 at 12:12 PM swyx ***@***.***> wrote: can you try adding <style type="text/scss">? if you have the preprocessor setup correctly it should "just work". https://github.com/sveltejs/language-tools/tree/master/packages/svelte-vscode#generic-setup — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#182 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AIZZBZ7KVQ6527NAXN6I2RTRV7LLRANCNFSM4N2U6KHA> .

-- Regards, -- Khan Kibria

[kkibria]

Nope, I take it back :( still having the same problem.

[swyxio]

can you post a small repro repo like https://github.com/dummdidumm/template ? with your additions so that i can just clone and take a look

[kylecordes]

This can be reproduced in the postcss example shipped with Svite:

https://github.com/dominikg/svite/tree/master/examples/postcss-tailwind

[jasonlyu123]

you could set lang to postcss

<style lang="postcss"></style>

This would disabled css validation but not svelte's unused css warning. Fully support postcss or tailwind is a big work unless there are some plug and play solution, I don't think it is coming soon.

[kylecordes]

@jasonlyu123 Yes, was hoping to have the validation of the tailwind syntax I was using, rather than just disable it; but I don't know if any of the other supporting tools are ready for this yet.

[dummdidumm]

How are you getting tailwind intellisense in other files? I guess it's some VSCode extension? If yes, maybe that has a setting to treat svelte files as html files, which might be enough.
For example this extension has a setting where you could do

{
  "tailwindCSS.includeLanguages": {
    "svelte": "html"
  }
}

[dummdidumm]

We won't be supporting TailwindCSS-Syntax, but we added docs on how to integrate our extension with other VSCode extensions to get it working. PRs to enhance the docs are welcome if you think they are too sparse.