この記事の内容
起きたこと
herokuを使って講座で作成したWebアプリをデプロイしようしたところ、なにやらたくさんエラーが起こりました。
おきたエラーの詳細はエラー詳細に記載しています。
前提（バージョンなど）
- Ruby：2.7.7
- Rails：6.0.6.1
- Node.js：14.15.0
- Windows11でUbuntu(WSL2)を導入
原因
- Rubyのバージョンがherokuの最新バージョンに対応していなかった
- Nodeのバージョンがherokuが標準で使用するバージョンと異なっていた
- buildpackを導入していなかった
エラー詳細1
エラーメッセージ
!
! The Ruby version you are trying to install does not exist on this stack.
!
! You are trying to install ruby-2.7.7 on heroku-22.
!
! Ruby ruby-2.7.7 is present on the following stacks:
!
! - heroku-20
!
! Heroku recommends you use the latest supported Ruby version listed here:
! https://devcenter.heroku.com/articles/ruby-support#supported-runtimes
!
! For more information on syntax for declaring a Ruby version see:
! https://devcenter.heroku.com/articles/ruby-versions
!
! Push rejected, failed to compile Ruby app.
! Push failed
原因
使っているRubyのバージョンが古い（デイトラよ…アップデートしてくれ…）
推測の根拠
エラー文の下記の記述
Ruby ruby-2.7.7 is present on the following stacks:
- heroku-20
対応
heroku20へのダウングレードするために下記のコマンドをUbuntsで実行
heroku stack:set heroku-20 -a heroku上で設定したアプリ名
結果
Setting stack to heroku-20... done
が表示される
エラー詳細2
エラーメッセージ
File "/app/.node-gyp/20.9.0/include/node/common.gypi", line 1
nerate ',
^
SyntaxError: EOL while scanning string literal
gyp ERR! configure error
gyp ERR! stack Error: `gyp` failed with exit code:
原因
Node.jsのバージョンが原因と推測。
具体的には開発環境のバージョンは14、herokuは指定しない限り20。
おそらくバージョンの違いによりnode.jsに依存しているnode-sassの挙動がおかしくなり、syntax errorが出たものと思われる。
推測の根拠
エラー名で検索したところ、下記のような記事に当たる。
https://github.com/datamllab/rlcard-showdown/issues/50
https://github.com/tensorflow/tfjs/issues/7902
対応
package.jsonにnode.jsのバージョンを指定
{
"name": "******",
"private": true,
"engines": { //ここを追記
"node": "14.x" //ここを追記
}, //ここを追記
"dependencies": {
"@rails/actioncable": "^6.0.0",
"@rails/activestorage": "^6.0.0",
"@rails/ujs": "^6.0.0",
"@rails/webpacker": "4.3.0",
"turbolinks": "^5.2.0"
},
"version": "0.1.0"
}
結果
別のエラーメッセージが出るようになる
エラー詳細3
エラーメッセージ
The engine "node" is incompatible with this module. Expected version "14.x". Got "20.9.0"
error Found incompatible module.
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
原因
buildpack がインストールされていない
推測の根拠
下記記事を参考にbuildpack を確認したところ、インストールされていないことが判明
https://devcenter.heroku.com/ja/articles/nodejs-support#specifying-a-node-js-version
対応
下記のコマンドを実行し、buildpack をインストール
heroku buildpacks:add heroku/nodejs --app heroku上で設定したアプリ名
結果
Buildは完了するが、releaseでエラーが発生する
エラー詳細4
エラーメッセージ
heroku /bin/sh: 1: bundle: not found
原因
適切なbundleがインストールされていない
推測の根拠
下記の記事を確認
https://devcenter.heroku.com/ja/articles/bundler-version#why-can-t-the-bundler-version-be-configured
対応
下記をUbuntsで実行
heroku buildpacks:add heroku/nodejs --index 1 --app heroku上で設定したアプリ名
heroku buildpacks:add heroku/ruby --index 2 --app heroku上で設定したアプリ名
注意点
herokuの以下の公式ドキュメントにあるように、第一言語の buildpack は、常にリストの最後にする必要があるようです。
https://devcenter.heroku.com/ja/articles/using-multiple-buildpacks-for-an-app
アプリの第一言語の buildpack は、常にリストの最後の buildpack にしてください。これにより、別の言語のデフォルト値でなく、その第一言語のデフォルト値が必ず適用されるようになり、Heroku でアプリの第一言語を正しく検出することができます。
実際にこれを守らずにデプロイしようとしたところ、
The engine "node" is incompatible with this module. Expected version "14.x". Got "20.9.0"
のエラーが発生しました。
buildpackのリストは以下のコマンドで確認できます。
heroku buildpacks -a heroku上で設定したアプリ名
順番を並び替えるためには、以下のコマンドで一度全て削除して、正しい順番で入れ直すのがわかりやすそうです。
heroku buildpacks:clear
結果
無事デプロイが完了しました！