heybourn / headwind

An opinionated Tailwind CSS class sorter built for Visual Studio Code
https://marketplace.visualstudio.com/items?itemName=heybourn.headwind
MIT License
1.38k stars 45 forks source link

Conflict with Prettier class sorting #169

Open gekkedev opened 3 years ago

gekkedev commented 3 years ago

Prettier introduced this new "great" feature of placing only one class in every line - infortunately this surfaces in Vetur as well. Combined with Headwind, I notice a strange flickering when Prettier formats something, while Headwind also sorts the classes. They overwrite each other's formatting results instead of working on top of each other (ideally, Headwind could sort first and then Prettier can do its wrapping).

To Reproduce Steps to reproduce the behavior:

  1. Install Vetur, Headwind, and Prettier
  2. Open a Vue component and make a class tag long enough to be wrapped (must be Tailwind classes)
  3. Watch your IDE flicker as the formattings overwrite each other

Expected behavior Running a Prettier check via CLI should pass (without formatting via CLI) based on the code saved via IDE.