5

I'm working on a React project and using shadcn/ui. I tried to install and set up Tailwind CSS using the following commands:

  1. Installed Tailwind CSS, PostCSS, and Autoprefixer:
npm install -D tailwindcss postcss autoprefixer
  1. Tried to initialize the Tailwind CSS configuration:
npx tailwindcss init -p

However, when I ran the second command, I got the following error:

npm error could not determine executable to run npm error A complete log of this run can be found in: C:\Users\Pc\AppData\Local\npm-cache_logs<timestamp>-debug-0.log

log file:

0 verbose cli C:\Program Files\nodejs\node.exe C:\Users\Pc\AppData\Roaming\npm\node_modules\npm\bin\npm-cli.js 1 info using [email protected] 2 info using [email protected] 3 silly config load:file:C:\Users\Pc\AppData\Roaming\npm\node_modules\npm\npmrc 4 silly config load:file:D:\ReactJS\travel-site.npmrc 5 silly config load:file:C:\Users\Pc.npmrc 6 silly config load:file:C:\Users\Pc\AppData\Roaming\npm\etc\npmrc 7 verbose title npm exec tailwindcss init -p 8 verbose argv "exec" "--" "tailwindcss" "init" "-p" 9 verbose logfile logs-max:10 dir:C:\Users\Pc\AppData\Local\npm-cache_logs\2025-01-25T08_30_42_408Z- 10 verbose logfile C:\Users\Pc\AppData\Local\npm-cache_logs\2025-01-25T08_30_42_408Z-debug-0.log 11 silly logfile start cleaning logs, removing 1 files 12 silly logfile done cleaning log files 13 silly packumentCache heap:2197815296 maxSize:549453824 maxEntrySize:274726912 14 verbose stack Error: could not determine executable to run 14 verbose stack
at getBinFromManifest (C:\Users\Pc\AppData\Roaming\npm\node_modules\npm\node_modules\libnpmexec\lib\get-bin-from-manifest.js:17:23) 14 verbose stack at exec (C:\Users\Pc\AppData\Roaming\npm\node_modules\npm\node_modules\libnpmexec\lib\index.js:202:15) 14 verbose stack at async Npm.exec (C:\Users\Pc\AppData\Roaming\npm\node_modules\npm\lib\npm.js:207:9) 14 verbose stack at async module.exports (C:\Users\Pc\AppData\Roaming\npm\node_modules\npm\lib\cli\entry.js:69:5) 15 verbose pkgid [email protected] 16 error could not determine executable to run 17 verbose cwd D:\ReactJS\travel-site 18 verbose os Windows_NT 10.0.19045 19 verbose node v20.18.0 20 verbose npm v11.0.0 21 verbose exit 1 22 verbose code 1 23 error A complete log of this run can be found in: C:\Users\Pc\AppData\Local\npm-cache_logs\2025-01-25T08_30_42_408Z-debug-0.log

I've noticed that some others have reported the same issue, but I couldn't find a clear solution that worked for my case.

How can I fix this issue and successfully initialize Tailwind CSS using npx in my project?

Improve this question
3

1 Answer 1

Reset to default
6

Update 2025-02-06

Now, Shadcn officially started supporting TailwindCSS v4. See:

Original

We've discussed shadcn/ui in more detail, which, as of today, does not officially support v4. That is, the steps required for v4 installation are not present in its documentation.

The Shadcn UI installation with Vite guides are still based on TailwindCSS v3. You can either use them with npm install tailwindcss@3 or completely disregard them and follow the steps for TailwindCSS v4 instead:

Recently, we updated the v3 documentation with the TailwindCSS team. The new v3 installation is:

npm install tailwindcss@3

However, this was not reflected in the shadcn/ui documentation.

If you install TailwindCSS with this command, you'll be installing v3, and you can follow the old installation procedure. In other cases, you will be installing v4, which can be installed using the guide linked above and can be understood.

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.