はじめに
追記
↓tailwind v4.0に対応した方法の記事がきました!↓
追記ここまで
昨日あたりからtailwindをインストールしようとすると以下のエラーが出るようになってしまいました。
/bin/sh: 1: tailwindcss: not found
error Command failed with exit code 127.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
取り急ぎ、tailwindのバージョンを指定してインストールし直すことで対処できたので、ここにまとめます。
前提
筆者環境は以下となります
- ruby 3.3.6
- rails 7.2.2
- docker使用
初学者の記事となるので、足りない部分や間違った部分等あれば、補足いただけると幸いです。
とりいそぎ調べてみる
まず、以下のサイトを参考に環境構築を行ったところ、前までは問題なくできていたのに、今回は以下コマンド実行時にエラーが発生しました。
docker compose run --rm web rails new . -d postgresql -j esbuild --css=tailwind --skip-kamal --skip-solid
/bin/sh: 1: tailwindcss: not found
error Command failed with exit code 127.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
tailwind公式のBlogを見てみると、1月22日にv4.0をリリースしたとの情報がありました。
おそらくこれが悪さをしていると考えました。
初学者の私は、取り急ぎバージョンを落として対処します。
(誰かがv4.0の新しい仕様を理解して、使用できるようにまとめてくれるのを待つ形です)
次の項目は前述の記事を参考に、以下コマンド実行後の状態からスタートします。
docker compose run --rm web rails new . -d postgresql -j esbuild --css=tailwind --skip-kamal --skip-solid
package.json
に記載のバージョンを編集し、yarn install
アプリケーションディレクトリ内に存在する、package.json
を開いていただくと、インストールしているtailwindcss
のバージョンが記載してあります。
それを編集します。
変更先のバージョンはお手元で使用中のバージョンで問題ないと思います。
私の場合は^3.4.15
としました。
{
"name": "app",
"private": true,
"devDependencies": {
"esbuild": "^0.24.2"
},
"scripts": {
"build": "esbuild app/javascript/*.* --bundle --sourcemap --format=esm --outdir=app/assets/builds --public-path=/assets",
"build:css": "tailwindcss -i ./app/assets/stylesheets/application.tailwind.css -o ./app/assets/builds/application.css --minify"
},
"dependencies": {
"@hotwired/stimulus": "^3.2.2",
"@hotwired/turbo-rails": "^8.0.12",
"autoprefixer": "^10.4.20",
"postcss": "^8.5.1",
"tailwindcss": "^4.0.0" //これがtailwindのバージョン
}
}
↓↓
.
.
.
"tailwindcss": "^3.4.15" //私が最新で使用していたバージョンに修正
}
}
その後、yarn install
を行います。
user@user:~/workspace/test$ docker compose run --rm web yarn install
[+] Creating 1/0
✔ Container test-db-1 Running 0.0s
yarn install v1.22.22
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Saved lockfile.
Done in 7.54s.
これでtailwind
のバージョンを指定してインストールできました。
ここからは、いつも通りの手順に戻れば問題なく動作しました。
さいごに
お読みいただきありがとうございました。
とりいそぎまとめたので、読みづらい部分もあったかと思いますが、ご容赦ください。
何か少しでも助けになれれば、幸いです。