[bug]: pnpm dlx tailwindcss init -p doesn't work anymore

[MyGoiLeGoy]

Describe the bug

pnpm dlx tailwindcss init -p doesn't work anymore

it was what we had to do in tailwind v3
https://v3.tailwindcss.com/docs/installation

tailwind v4 doesn't require it anymore
https://tailwindcss.com/docs/installation/using-vite

I believe you guys should update the doc

Affected component/components

All

How to reproduce

in the installation guide (https://ui.shadcn.com/docs/installation/vite#add-tailwind-and-its-configuration), at step 2: pnpm dlx tailwindcss init -p

Codesandbox/StackBlitz link

No response

Logs

System Info

Windows 11 x64
Node 22.11

Before submitting

• I've made research efforts and searched the documentation
• I've searched for existing issues

[alfinauzikri]

Yes, I just had the same problem.

[Frallan97]

If anyone is here is wondering about a solution. You should downgrade your "tailwindcss": "^4.0.0", to "tailwindcss": "^3.3.4" and remove node_modules and package-lock.json and reinstall.

This will solve your problem @alfinauzikri

[alfinauzikri]

Well I'll try it, thanks for the answer. @Frallan97

[Frallan97]

And use npm, it is wierd, i can not get it to work with pnpm @alfinauzikri it is weird. But bun works..

[migtibincoski]

Hey @alfinauzikri, how are you?

I literally just solved this problem here.

I was using npx tailwindcss@latest init -p, and it gave me the same error. I even analyzed the project code with JsDelivr, and nothing. Until I realized that Tailwind was updated two days ago.

I looked at the documentation of the previous stable version (v3.4.17) and saw that it was only updated.

In my case, I modified the command, since the latest version of Tailwindcss was not added to my package.json.

$ npx [email protected] init -p

I specified the package version, in this case. If you follow @Frallan97's recommendation, you can use this command.

In your case, I think it's the same, just use:

$ pnpm dlx [email protected] init -p

Thank you for your attention!

Miguel Tibincoski
Musician, composer, music producer, programmer, student

[alfinauzikri]

Hi, @Frallan97

I've just tried with fresh installation.

node v20.14.0
pnpm 9.15.2

Change the command:

> pnpm dlx tailwindcss init -p
ERR_PNPM_DLX_NO_BIN  No binaries found in tailwindcss

With :

> npx tailwindcss init -p
Created Tailwind CSS config file: tailwind.config.js
Created PostCSS config file: postcss.config.js

Full Commands:

pnpm create vite@latest .
pnpm install
pnpm add -D [email protected] postcss autoprefixer
npx tailwindcss init -p
pnpm add -D @types/node
pnpm dlx shadcn@latest init

Results:

PS C:\Workspaces\MyOrganization\example> pnpm create vite@latest .       
√ Current directory is not empty. Please choose how to proceed: » Ignore files and continue
√ Select a framework: » React
√ Select a variant: » TypeScript + SWC

Scaffolding project in C:\Workspaces\MyOrganization\example...

Done. Now run:

  pnpm install
  pnpm run dev

PS C:\Workspaces\MyOrganization\example> pnpm install
Packages: +142
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Progress: resolved 194, reused 142, downloaded 0, added 142, done

dependencies:
+ react 18.3.1 (19.0.0 is available)
+ react-dom 18.3.1 (19.0.0 is available)

devDependencies:
+ @eslint/js 9.18.0
+ @types/react 18.3.18 (19.0.8 is available)
+ @types/react-dom 18.3.5 (19.0.3 is available)
+ @vitejs/plugin-react-swc 3.7.2
+ eslint 9.18.0
+ eslint-plugin-react-hooks 5.1.0
+ eslint-plugin-react-refresh 0.4.18
+ globals 15.14.0
+ typescript 5.6.3 (5.7.3 is available)
+ typescript-eslint 8.21.0
+ vite 6.0.11

Done in 3.9s
PS C:\Workspaces\MyOrganization\example> pnpm add -D [email protected] postcss autoprefixer
Packages: +90
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Progress: resolved 273, reused 221, downloaded 0, added 90, done

devDependencies:
+ autoprefixer 10.4.20
+ postcss 8.5.1
+ tailwindcss 3.4.17 (4.0.0 is available)

Done in 2.4s
PS C:\Workspaces\MyOrganization\example> pnpm dlx tailwindcss init -p
 ERR_PNPM_DLX_NO_BIN  No binaries found in tailwindcss
PS C:\Workspaces\MyOrganization\example> npx tailwindcss init -p

Created Tailwind CSS config file: tailwind.config.js
Created PostCSS config file: postcss.config.js
PS C:\Workspaces\MyOrganization\example> pnpm add -D @types/node
Packages: +4
++++
Progress: resolved 275, reused 223, downloaded 0, added 4, done

devDependencies:
+ @types/node 22.10.9

Done in 1.3s
PS C:\Workspaces\MyOrganization\example> pnpm dlx shadcn@latest init
✔ Preflight checks.
✔ Verifying framework. Found Vite.
✔ Validating Tailwind CSS.
✔ Validating import alias.
√ Which style would you like to use? » New York
√ Which color would you like to use as the base color? » Zinc
√ Would you like to use CSS variables for theming? ... no / yes
✔ Writing components.json.
✔ Checking registry.
✔ Updating tailwind.config.js
✔ Updating src\styles\global.css
✔ Installing dependencies.
✔ Created 1 file:
  - src\lib\utils.ts

Success! Project initialization completed.
You may now add components.

Hopefully this will help you resolve your issue..

[alfinauzikri]

I just tested it and solved the problem too. @migtibincoski