##初めに
rails でアプリを作成し、herokuでデプロイしようとした時にハマったエラーです。
herokuのドキュメント通りに以下を実行しました。
brew install heroku/brew/heroku
heroku login
heroku create
git push heroku main → エラー発生
##開発環境
macOS Big Sur
Ruby 2.6.6
rails 6.1.2
heroku 7.47.12
node v14.15.4
##状況①
git push heroku mainを実行すると
以下のエラーが発生
remote: ! Could not detect rake tasks
remote: ! ensure you can run `$ bundle exec rake -P` against your app
remote: ! and using the production group of your Gemfile.
remote: ! /tmp/build_a32ae899/vendor/ruby-2.6.6/lib/ruby/2.6.0/rubygems/dependency.rb:311:in `to_specs': Could not find 'spring' (= 2.1.1) among 117 total gem(s) (Gem::MissingSpecError)
remote: ! Checked in 'GEM_PATH=/tmp/build_a32ae899/vendor/bundle/ruby/2.6.0', execute `gem env` for more information
remote: ! from /tmp/build_a32ae899/vendor/ruby-2.6.6/lib/ruby/2.6.0/rubygems/dependency.rb:323:in `to_spec'
remote: ! from /tmp/build_a32ae899/vendor/ruby-2.6.6/lib/ruby/2.6.0/rubygems/core_ext/kernel_gem.rb:65:in `gem'
remote: ! from /tmp/build_a32ae899/bin/spring:15:in `<top (required)>'
remote: ! from /tmp/build_a32ae899/bin/rake:4:in `load'
remote: ! from /tmp/build_a32ae899/bin/rake:4:in `<main>'
spring GemがなくてGem::MissingSpecErrorが検出されてしまっていることが判明。
(たくさんの記事があるbundler関連のエラーではなかった。)
以下の記事を参考に修正を試みる。
https://teratail.com/questions/314173
https://github.com/rails/rails/issues/40911
https://yumishin.com/spring-spec-error/
ざっくり記事をまとめると
rails6.0では起動していたがrails6.1だとこのようなエラーが発生してしまうらしい。
なので、そもそもspring gemを使わないようにすることで対策をとったという内容です。
###実施したこと
group :development do
# Access an interactive console on exception pages or by calling 'console' anywhere in the code.
gem 'web-console', '>= 4.1.0'
# Display performance information such as SQL time and flame graphs for each request in your browser.
# Can be configured to work on production as well see: https://github.com/MiniProfiler/rack-mini-profiler/blob/master/README.md
gem 'listen', '~> 3.3'
gem 'rack-mini-profiler', '~> 2.0'
# Spring speeds up development by keeping your application running in the background. Read more: https://github.com/rails/spring
gem 'rubocop', require: false
# gem 'spring' ← コメントアウトにしました。
# gem 'spring-commands-rspec' ← コメントアウトにしました。
end
再度、git push heroku main を実行
すると、、、
##状況②
remote: ! Could not detect rake tasks
remote: ! ensure you can run `$ bundle exec rake -P` against your app
remote: ! and using the production group of your Gemfile.
remote: ! /tmp/build_38add2cc/config/boot.rb:6:in `require': cannot load such file -- bootsnap/setup (LoadError)
remote: ! from /tmp/build_38add2cc/config/boot.rb:6:in `<top (required)>'
remote: ! from /tmp/build_38add2cc/bin/rake:5:in `require_relative'
remote: ! from /tmp/build_38add2cc/bin/rake:5:in `<main>'
うん、、エラー内容が変わったから、一歩前進。
今度はbootsnap/setup なんてfileはロード出来ないよ、と言ってますね。
(bootsnapとは、https://qiita.com/Daniel_Nakano/items/aadeaa7ae4e227b73878)
以下の記事を参考に修正
https://qiita.com/cyborg__ninja/items/d15b50500f4ffb069feb
###実施したこと
# gem 'bootsnap', '>= 1.4.4', require: false ← コメントアウトしました
# require 'bootsnap/setup' ← コメントアウトしました
再度、git push heroku mainを実行
すると、、、
##状況③
remote: ! Could not detect rake tasks
remote: ! ensure you can run `$ bundle exec rake -P` against your app
remote: ! and using the production group of your Gemfile.
remote: ! /tmp/build_0750ee34/bin/rake:6:in `require': cannot load such file -- rake (LoadError)
remote: ! from /tmp/build_0750ee34/bin/rake:6:in `<main>'
ここでまた、違うエラーと遭遇。
、、、つまり一歩前進。
次はrakeファイルのエラー問題みたいだな。
どうやら、よくある、bundlerのバージョンの違いで発生しているエラー。
git push heroku mainでは
remote: -----> Installing dependencies using bundler 2.1.4
と表示されているのに対し、bundler -v を実行すると
Bundler version 2.2.9
と表示されることから、ローカル環境とherokuの環境に差異があることが判明
ローカル環境のbundlerバージョンを2.1.4にする。
以下を実行
% rm Gemfile.lock
% gem install bundler -v 2.1.4
% bundle _2.1.4_ install --without production
再度、git push heroku main を実行
すると、、、
##状況④
remote: error Couldn't find a package.json file in "/tmp/build_86c41e8f"
remote:
remote:
remote: !
remote: ! Precompiling assets failed.
remote: !
remote: ! Push rejected, failed to compile Ruby app.
remote:
remote: ! Push failed
が発生。エラー内容が段々シンプルになってきてる。
1行目のerror Couldn't find a package.json file in "/tmp/build_86c41e8f"が問題のよう。
% npm init
このコマンドを実行し、いくつか質問されるので全てreturnで対応。
すると、package.jsonファイルが作成される。
ここで、git push heroku main
を実行。
すると、、、
##状況⑤
remote: error Command "webpack" not found.
remote:
remote:
remote: !
remote: ! Precompiling assets failed.
remote: !
remote: ! Push rejected, failed to compile Ruby app.
remote:
remote: ! Push failed
webpackがないとのことなので
rails webpacker:install
を実行後、
git push heroku main
すると、、、
##状況⑥
remote: ModuleNotFoundError: Module not found: Error: Can't resolve 'turbolinks' in '/tmp/build_51759ff8/app/javascript/packs'
remote: at /tmp/build_51759ff8/node_modules/webpack/lib/Compilation.js:925:10
remote: at /tmp/build_51759ff8/node_modules/webpack/lib/NormalModuleFactory.js:401:22
remote: at /tmp/build_51759ff8/node_modules/webpack/lib/NormalModuleFactory.js:130:21
remote: at /tmp/build_51759ff8/node_modules/webpack/lib/NormalModuleFactory.js:224:22
remote: at /tmp/build_51759ff8/node_modules/neo-async/async.js:2830:7
(以下省略)
Can't resolve 'turbolinks' とのことなので以下の記事を参考にする。
https://stackoverflow.com/questions/59344632/cannot-find-module-rails-ujs-rails-6-webpack-app
yarn add rails-ujs turbolinks
npm install rails-ujs turbolinks
を実行。
再度、git push heroku main
##状況⑦
remote: ModuleNotFoundError: Module not found: Error: Can't resolve '@rails/ujs' in '/tmp/build_01a89792/app/javascript/packs'
remote: at /tmp/build_01a89792/node_modules/webpack/lib/Compilation.js:925:10
remote: at /tmp/build_01a89792/node_modules/webpack/lib/NormalModuleFactory.js:401:22
(以下省略)
先ほどとほとんど変わらない。けど、よく見て見るとCan't resolve以下が@rails/ujsに変化しました。
再度、先ほどと同じ記事を参考にして
yarn autoclean --init
で.yarncleanを作成。
.yarncleanファイルにある、
# asset directories
docs
doc
website
images
assets
これらを削除。
再度、
git push heroku mainコマンドを実行
、、、変化なし。
yarn add @rails/ujs
を実行後、再度git push heroku main
##状況⑧
remote: ModuleNotFoundError: Module not found: Error: Can't resolve '@rails/activestorage' in '/tmp/build_5a5ba780/app/javascript/packs'
remote: at /tmp/build_5a5ba780/node_modules/webpack/lib/Compilation.js:925:10
remote: at /tmp/build_5a5ba780/node_modules/webpack/lib/NormalModuleFactory.js:401:22
remote:
(以下省略)
先ほど同様に
yarn add @rails/activestorage
そして、git push heroku main
ついに、エラー解消!!!
デプロイ完了!!!
herokuで取得したurlにアクセスしてみると、、、
##状況⑨
We're sorry, but something went wrong.
If you are the application owner check the logs for more information.
ついに、ここまで辿り着きましたね。自分の成長ぶりに脱帽です。
(と言って自分を慰める)
heroku logs -t
のコマンドを入力し、エラー箇所を調査。
すると、
2021-02-16T10:19:10.359353+00:00 app[web.1]: [f82b25ed-22c7-4829-8491-8dfa334ea748] Completed 500 Internal Server Error in 48ms (ActiveRecord: 15.4ms | Allocations: 3563)
2021-02-16T10:19:10.360340+00:00 app[web.1]: [f82b25ed-22c7-4829-8491-8dfa334ea748]
2021-02-16T10:19:10.360342+00:00 app[web.1]: [f82b25ed-22c7-4829-8491-8dfa334ea748] ActionView::Template::Error (Webpacker can't find application.css in /app/public/packs/manifest.json. Possible causes:
エラー発見。ここを修正していく。
以下を参照して解決を試みる。
https://github.com/rails/webpacker/issues/2071
###実施したこと
/app/view/layouts/application.html.erbファイルに移動
<%# <%= stylesheet_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
#↑コメントアウトしました
ようやく、web上でアプリ開けました!!!