Error when used with Tailwind 3.0.0

[gedzeppelin]

Describe the bug
The extensions fails when update to Tailwind v3. Both Prettier CLI and ESLint (with prettier plugin) CLI fails with the same error message.

To Reproduce
Steps to reproduce the behavior:

1. Open any Tailwind project.
2. Update Tailwind to v3.0.0.
3. Run prettier.

Stack trace

node:internal/modules/cjs/loader:936
  throw err;
  ^

Error: Cannot find module '/home/gedzeppelin/hdd/Code/TS/portfolio-front/node_modules/tailwindcss/lib/util/processPlugins'
Require stack:
- /home/gedzeppelin/hdd/Code/TS/portfolio-front/node_modules/tailwind-classes-sorter/lib/index.js
- /home/gedzeppelin/hdd/Code/TS/portfolio-front/node_modules/prettier-plugin-tailwind/lib/index.js
- /home/gedzeppelin/hdd/Code/TS/portfolio-front/node_modules/prettier-plugin-tailwind/prettier-plugin-tailwind.js
- /home/gedzeppelin/hdd/Code/TS/portfolio-front/node_modules/prettier/index.js
- /home/gedzeppelin/hdd/Code/TS/portfolio-front/node_modules/prettier/bin-prettier.js
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
    at Function.Module._load (node:internal/modules/cjs/loader:778:27)
    at Module.require (node:internal/modules/cjs/loader:999:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at new TWClassesSorter (/home/gedzeppelin/hdd/Code/TS/portfolio-front/node_modules/tailwind-classes-sorter/lib/index.js:28:31)
    at Object.<anonymous> (/home/gedzeppelin/hdd/Code/TS/portfolio-front/node_modules/prettier-plugin-tailwind/lib/index.js:10:25)
    at Module._compile (node:internal/modules/cjs/loader:1097:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1149:10)
    at Module.load (node:internal/modules/cjs/loader:975:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/home/gedzeppelin/hdd/Code/TS/portfolio-front/node_modules/tailwind-classes-sorter/lib/index.js',
    '/home/gedzeppelin/hdd/Code/TS/portfolio-front/node_modules/prettier-plugin-tailwind/lib/index.js',
    '/home/gedzeppelin/hdd/Code/TS/portfolio-front/node_modules/prettier-plugin-tailwind/prettier-plugin-tailwind.js',
    '/home/gedzeppelin/hdd/Code/TS/portfolio-front/node_modules/prettier/index.js',
    '/home/gedzeppelin/hdd/Code/TS/portfolio-front/node_modules/prettier/bin-prettier.js'
  ]
}

Versions:

• prettier-plugin-tailwind version: 2.2.12
• Operating system: Linux 64 bits
• NPM/Yarn version: Yarn 1.22.17
• Node.js: v17.1.0

[lobosan]

Same issue here, any estimates on the solution?

[Andrey-Bazhanov]

related to tqwewe/tailwind-classes-sorter#9

[mryechkin]

Same issue here, any estimates on the solution?

Don't think we'll be seeing one anytime soon, sadly :(

Project is no longer maintained: #46

[kuubson]

Same issue here, any estimates on the solution?

Don't think we'll be seeing one anytime soon, sadly :(

Project is no longer maintained: #46

so a temporary solution is to start using an extension Headwind for vscode

[mryechkin]

FYI - Tailwind now provides an official plugin: https://tailwindcss.com/blog/automatic-class-sorting-with-prettier

[cungminh2710]

I tried using this plugin after the official announcement. Still no luck with this error

[tqwewe]

@cungminh2710 this isn't the official tailwindcss prettier plugin. Did you try the one linked above? I think theirs should stay updated with tailwinds versions

[cungminh2710]

oh somewhere this was linked. regardless thanks @tqwewe for your amazing work

[yannickoo]

Thanks @tqwewe for putting the effort into this project! 💪 Posting the solution so that the others can easily find it.

---

⚠️ I'm pretty sure you are using the unofficial plugin prettier-plugin-tailwind instead of prettier-plugin-tailwindcss.

You can easily fix this by executing the following ⬇️

npm uninstall prettier-plugin-tailwind
npm install -D prettier-plugin-tailwindcss

[gedzeppelin]

@tqwewe thanks!. I think i can close this issue now.