npxでtailwindcssをinitできない問題

こんにちは、うっしーです。

Next.jsでUIコンポーネント集であるshadcn/uiをインストールする際に打つことになる以下コマンドを叩くと、エラーが発生してしまいます。

npx tailwindcss init

以下がエラー内容。

npm error could not determine executable to run
npm error A complete log of this run can be found in: /Users/ユーザ/.npm/_logs/2025-03-20T09_22_07_111Z-debug-0.log

簡単に訳すと、
「npmが実行するための適切なコマンドまたは実行可能ファイルを見つけられなかった」
ということでした。

解決方法

TailwindCSSのバージョンが4系になってインストール方法が変わったらしいです。

Installing with Vite - Installation

Integrate Tailwind CSS with frameworks like Laravel, SvelteKit, React Router, and SolidJS.

tailwindcss.com

今まで通りの方法でインストールする場合、以下のように3系を指定してあげるとインストールが成功します。

npm install -D tailwindcss@3.4.13 autoprefixer postcss

おわりに

これに1時間以上悩んでしまった・・・
こうやって成長していくのだろうか。