TailwindCSS 설치 오류 해결

npm으로 tailwincss 설치시 “npm error could not determine executable to run”가 발생한다면 tailwindcss 버전이 맞지 않아서 그런 것이므로 낮은 버전을 설치하던가, package.json 파일을 수정한 다음 설치해야 합니다.

아래는 구체적인 에러 메시지 내용입니다.

1. 원인

핵심 오류는 이 부분이에요 👇

Error: could not determine executable to run
verbose pkgid tailwindcss@4.1.14

npm 11 + tailwindcss 최신 버전(4.x) 조합에서 발생하는 공식적으로 보고된 버그입니다.
현재 tailwindcss@4.x는 정식 릴리스가 아니고, npx로 실행 시 **실행 파일(bin)**을 제대로 인식하지 못합니다.

2. 해결 방법

가. 안정 버전 설치(권장)

TailwindCSS 4.x 대신 3.x 버전을 사용하면 즉시 해결됩니다.

npm uninstall tailwindcss
npm install -D tailwindcss@3 postcss autoprefixer
npx tailwindcss init -p

이렇게 하면 정상적으로 실행됩니다.
→ tailwindcss@3.4.17 (2025년 기준 안정 버전) 기준으로 작동 확인됨.

나. 4.x를 유지하고 싶다면(실험적)

TailwindCSS 4.x는 구조가 바뀌어서 npx로 직접 실행이 안 됩니다.
대신 package.json의 “scripts”로 실행해야 해요.

1️⃣ package.json에 다음 추가:

"scripts": {
  "tailwind": "tailwindcss"
}

2️⃣ 그 다음 명령어:

npm run tailwind init -p

이 방식이면 Tailwind 4.x도 동작합니다.