Zenn
🌊

【Tailwind4】" npx tailwindcss init -p " でファイルが自動生成されずにエラーとなった場合の解決方法

に公開
React
CLI
Tailwind CSS
Vite
tech

開発環境

・react：v19
・node：v20.19.1
・パッケージ管理ツール npm：v10.8.2
・開発サーバー・ビルドツール vite：6.3.1

エラー内容

npm error could not determine executable to run
npm error A complete log of this run can be found in: /Users/{ユーザ名}/.npm/_logs/2025-04-28T02_31_27_394Z-debug-0.log

結論

Tailwind v4からCLIツールが別パッケージに分離され、明示的なインストールが必要になったため

解決方法

Tailwind CLIを明示的にインストールする

npm install -D tailwindcss-cli

※Tailwind本体のインストールがまだの方はこちら
npm install -D tailwindcss@latest postcss@latest autoprefixer@latest

node_modules/.bin配下に「tailwindcss-cli」が作られている事を確認。

改めてコマンドを実行（ただし、taiwindcssではなくtailwindcss-cli）

npx tailwindcss-cli init -p

❌　npx tailwindcss init -p

下記レスポンスが返ってきたらファイルの自動生成が成功！

Created Tailwind CSS config file: tailwind.config.js
Created PostCSS config file: postcss.config.js

Discussion