You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I noticed that, despite being listed as a compatible plugin in the README, @ianvs/prettier-plugin-sort-imports is incompatible with prettier-plugin-tailwindcss. With the Tailwind plugin listed last in the plugins array (as instructed in the README), it still takes precedence over the sort plugin and effectively disables it.
Notably, this only occurs when using a JS-based prettier.config.js file (where plugins are require'd) rather than a JSON-based .prettierrc. I suspect this is due to the require changing how plugins are loaded, but I'm not familiar with the internals of either plugin to be sure.
Some alternatives I tried:
using @trivago/prettier-plugin-sort-imports instead - this has the same issue
using a different package manager - npm v8.18, Yarn v1.22 and pnpm v8.3 all have the same issue
using prettier-plugin-tailwindcssv0.2.3, as this was the first version to officially support @ianvs/prettier-plugin-sort-imports - no luck
creating a custom plugin combining aspects of both - this actually did work, but is far from elegant
If this is expected functionality, it may be a good idea to make a note of the differences between prettier.config.js and .prettierrc in prettier-plugin-tailwindcss's README (especially given that it shows examples using both).
(this is a duplicate of a discussion I opened a few weeks ago - didn't get any traction there, but if you'd rather move discussion back feel free to close this!)
The text was updated successfully, but these errors were encountered:
What version of Tailwind CSS are you using?
tailwindcss
v3.3.2,prettier-plugin-tailwindcss
v0.2.8What build tool (or framework if it abstracts the build tool) are you using?
vite
v4.3.1 (but in my reproduction repo that's not too relevant, this is just a Prettier issue)What version of Node.js are you using?
v18.8.0
What browser are you using?
N/A
What operating system are you using?
macOS
Reproduction URL
https://github.com/chrissantamaria/prettier-plugin-tailwindcss-sort-order-bug
Describe your issue
I noticed that, despite being listed as a compatible plugin in the README,
@ianvs/prettier-plugin-sort-imports
is incompatible withprettier-plugin-tailwindcss
. With the Tailwind plugin listed last in theplugins
array (as instructed in the README), it still takes precedence over the sort plugin and effectively disables it.Notably, this only occurs when using a JS-based
prettier.config.js
file (where plugins arerequire
'd) rather than a JSON-based.prettierrc
. I suspect this is due to therequire
changing how plugins are loaded, but I'm not familiar with the internals of either plugin to be sure.Some alternatives I tried:
@trivago/prettier-plugin-sort-imports
instead - this has the same issueprettier-plugin-tailwindcss
v0.2.3, as this was the first version to officially support@ianvs/prettier-plugin-sort-imports
- no luckIf this is expected functionality, it may be a good idea to make a note of the differences between
prettier.config.js
and.prettierrc
inprettier-plugin-tailwindcss
's README (especially given that it shows examples using both).(this is a duplicate of a discussion I opened a few weeks ago - didn't get any traction there, but if you'd rather move discussion back feel free to close this!)
The text was updated successfully, but these errors were encountered: