search

theron-wang / VS2022-Editor-Support-for-Tailwind-CSS

Unofficial VS2022 Tailwind CSS extension for IntelliSense, linting, sorting, and more to enhance the development experience in Visual Studio 2022.
https://marketplace.visualstudio.com/items?itemName=TheronWang.TailwindCSSIntellisense
MIT License
86 stars 5 forks source link

Class name sorting when conditionals is present. #39

Closed gm-ecreo closed 4 months ago

gm-ecreo commented 4 months ago

Hi.

We often use alpine js in our projects and use conditionals in our classes.

Ex: x-bind:class="open ? 'bg-green-dark text-white' : 'border-2 border-green-dark text-green-dark' "

When saving the file the extension sorts it so the outcome becomes this:

x-bind:class="open ? 'bg-green-dark text-white' 'border-2 border-green-dark text-green-dark' :"

and thereby breaking the conditional which results in js errors.

Is there a way to fix this?

Best regards.

theron-wang commented 4 months ago

For now, you can disable the feature in Tools > Options > Tailwind CSS IntelliSense and set the sort feature to None. I’ll take a look at this and get back to you.

Thanks for letting me know!

gm-ecreo commented 4 months ago

@theron-wang Thank you! :-)

theron-wang commented 4 months ago

This should be fixed in 1.3.1. Please let me know if you encounter any more issues. Again, thanks for letting me know!

HugCoder commented 3 months ago

The same issue seems to affect ng-class from angularjs. ng-class="{true: 'fa-toggle-on', false: 'fa-toggle-off'}[invoice.IsCreditInvoice]" might turn into ng-class="{true: ''fa-toggle-on', false: ''fa-toggle-off'}[invoice.IsCreditInvoice]" after saving the file. I first thought this was because of updating Visual Studio to 17.10.0 Preview 6.0, as it was fixed when I reverted to Preview 5. But I didn't notice at first that reverting also for some reason removed the extensions I had, including this one for Tailwind CSS. Now that I reinstalled it, I got the same problem and after disabling it, it was normal again.

theron-wang commented 3 months ago

@HugCoder Apologies for the late response - this should be fixed in 1.4.0. I was only able to reproduce this in a .razor file, not in a .html file, so could you confirm what type of file you were typing this in? I want to make sure that the issue is actually resolved.

Thanks!

HugCoder commented 3 months ago

@HugCoder Apologies for the late response - this should be fixed in 1.4.0. I was only able to reproduce this in a .razor file, not in a .html file, so could you confirm what type of file you were typing this in? I want to make sure that the issue is actually resolved.

Thanks!

No problem, the file is .cshtml in a MVC, .NET 8 webapp.