heybourn / headwind

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

Sorting not working with postcss in VSCode #186

Open tqwewe opened 2 years ago

tqwewe commented 2 years ago

Describe the bug Trying to sort classes in a .css/.pcss file does not work with VSCode using "PostCSS" for the file.

To Reproduce Steps to reproduce the behavior:

  1. Install Headwind from the extension store
  2. Add to package.json:
    "headwind.classRegex": {
      "css": "\\B@apply\\s+([_a-zA-Z0-9\\s\\-\\:\\/]+);",
      "postcss": "\\B@apply\\s+([_a-zA-Z0-9\\s\\-\\:\\/]+);"
    }
  3. Create a file styles.css and add the following:
    .button {
      @apply hover:bg-blue-800 text-white bg-blue-700;
    }
  4. Open the VSCode command pallet and run >Headwind: Sort Tailwind CSS Classes
  5. See nothing happens
  6. Change the active language from PostCSS to CSS
  7. Re-run the command in step 4.
  8. Classes sort successfully

Expected behavior I expect that PostCSS language should be supported by headwind and classes should be sorted with @apply.

Screenshots N/A

Desktop (please complete the following information):

Additional context N/A