Error when used with Tailwind 3.0.0

[Gedy Palomino]

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

[Santiago Galindo]

Same issue here, any estimates on the solution?

[Andrew Bazhanov]

related to tqwewe/tailwind-classes-sorter#9

[Mykhaylo Ryechkin]

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

[Mykhaylo Ryechkin]

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

[Minh Cung]

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

[Ari Seyhun]

@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

[Minh Cung]

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

[Yannick]

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

[Gedy Palomino]

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