feat: add tailwindStylesheet to prettierrc config for tailwind v4 upgrade#64
Conversation
|
Pas op. als je dus toolkit update in je project. Krijg je een flinke commitlist van al je css files die hun sorting weer goed doen. |
WybeBosch
requested review from
YvetteNikolov,
Copilot and
laravdiemen
and removed request for
Copilot
There was a problem hiding this comment.
Pull Request Overview
This PR adds Tailwind v4 configuration to the Prettier config to maintain consistent class sorting behavior. The change addresses an issue where Tailwind v4's default sorting differs from v3, which can cause problems when class order matters (e.g., @apply border-b-none border-2).
Key Changes:
- Adds
tailwindStylesheetconfiguration pointing to the Tailwind config file to preserve v3-style sorting behavior
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| require.resolve( 'prettier-plugin-tailwindcss' ), | ||
| ], | ||
| tailwindStylesheet: | ||
| './web/app/themes/sage/resources/styles/base/config.css', |
There was a problem hiding this comment.
The hardcoded path './web/app/themes/sage/resources/styles/base/config.css' may not work for all projects using this shared prettier config. Consider making this configurable or documenting that consumers should override this value in their local prettier config.
| './web/app/themes/sage/resources/styles/base/config.css', | |
| process.env.TAILWIND_STYLESHEET || './web/app/themes/sage/resources/styles/base/config.css', |
There was a problem hiding this comment.
Alle brave projecten hebben de sage folder. danku.
There was a problem hiding this comment.
Also ik heb gecheckt of deze config veilig is om te gebruiken in projecten die nog tailwind v3 hebben. En antwoord is ja.
YvetteNikolov
left a comment
YvetteNikolov
left a comment
There was a problem hiding this comment.
Kun je linkje van de documentatie toevoegen aan deze PR? Voor future reference
noordwijk-brave en meedoen-rijssenholten merkte ik taiwind v4 gekkigheid.
De sorting was anders. (sorten werkte. Maar anders)
Sorting anders maakt Bijna niet uit. Behalve heel soms als je dingen overschrijft in de zelfde apply
@apply border-b-none border-2nu is de border-2 de baas, want volgorde maakt uit.
Met deze config change, is de sorting hetzelfde als tijdens tailwind v3.
Zie hier documentatie van plugin zelf over tailwind v4
https://github.com/tailwindlabs/prettier-plugin-tailwindcss?tab=readme-ov-file#specifying-your-tailwind-stylesheet-path-tailwind-css-v4