はじめに
RailsアプリケーションをHerokuにデプロイする際、自分が詰まった箇所について説明します。
また、herokuへのデプロイ方法は、最終行に記載した＜4.デプロイ手順の参考記事＞を参考にデプロイをしました。
それぞれのバージョンは以下の通りです。
MacOS 10.14.5
Ruby 2.5.1p57
Rails 5.2.3
heroku/7.26.2 darwin-x64 node-v11.14.0
画像
https://gyazo.com/847aa4661ae3b2f278ae2328d33d32dd
1.Herokuにログインする時
①現象
以下のように、herokuにログインするコマンドを実行しても、
$heroku login
メールアドレスおよびパスワードを入力する画面いならない(おそらく、このような方法でログインすることもできるのだろう)。
動画(見えづらくて申し訳ありません(＞人＜;))
https://gyazo.com/e3873154a60890c7fa5aab07146c962c
②解決方法
以下のようなコマンドを入力すれば、解決できます。
$ heroku login --interactive
動画
https://gyazo.com/4829936b6a6626a7ea229383eecbeae9
③参考記事
2.Railsの設定
(1).Gemfileの設定
本番環境用にGemfileの設定しておかないと、以下のようなエラーが発生します。
(今回は、自分がアプリで使用したdeviseおよびjquery-railsの２つのgemを例にあげます。)
①エラー現象
以下のような画面が表示され、デプロイが失敗する。
deviseの場合、
remote: Caused by:
remote: NameError: uninitialized constant Devise
画像
https://gyazo.com/eb6608754ad0937c550eb45acdf848b5
jquery-railsの場合、
remote: rake aborted!
remote: Sprockets::FileNotFound: couldn't find file 'jquery' with type 'application/javascript'
画像
https://gyazo.com/71cc267fe306d82fdf6e65df2b2288a1
②解決方法
Gemfileの一番下に、以下のような設定をすると解決します(deviseおよびjquery-rails)。
group :development, :production, :test do
gem 'devise'
gem 'jquery-rails'
end
画像
https://gyazo.com/625adb044cecaff749c60f4f77fb317a
(2).テンプレートリテラル記法を用いる場合のproduction.rbの設定
①エラー現象
以下のようなエラー画面が表示され、デプロイが失敗する。
remote: rake aborted!
remote: Uglifier::Error: Unexpected character '`'
下の方に赤文字で以下のような表示がされる。
remote: ! Precompiling assets failed.
全体の画像
https://gyazo.com/37b8b091eda6cec2c0514b54dea5a5c5
②解決方法
config/environments/production.rbにある以下のコードをコメントアウトする。
# config.assets.js_compressor = :uglifier
自分の場合、production.rbの26行目に書いてありました。
https://gyazo.com/b66d6c1a13d7b22a5105f88e1303f40d
そもそも、テンプレートリテラル記法とは？
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/template_strings
3.デプロイ成功後
(1).デプロイは成功後にアクセスするURLについて
①現象
herokuへのデプロイが成功すると、以下のような長いログの画面が表示される
https://gyazo.com/2d2e4ea40e66373aa6b62cb7df7f15cc
(画面が青い理由は、どこからどこまでがデプロイのログなのかを、自分で判断するためです。見えづらくて申し訳ありません(＞人＜;))。
そして、以下のような画面が表示される。
$ git push heroku master
・
・
・
remote: -----> Compressing...
remote: Done: 36.9M
remote: -----> Launching...
remote: Released v6
remote: https://enigmatic-reaches-21915.herokuapp.com/ deployed to Heroku
remote:
remote: Verifying deploy... done.
To https://git.heroku.com/enigmatic-reaches-21915.git
* [new branch] master -> master
そして、同時にherokuへのURLが生成されます。
remote: Released v6
remote: https://enigmatic-reaches-21915.herokuapp.com/ deployed to Heroku
remote:
remote: Verifying deploy... done.
To https://git.heroku.com/enigmatic-reaches-21915.git
* [new branch] master -> master
②解決方法
アクセスできるURLは以下のような表示がされている方にアクセスすると解決します。
remote: https://＜個別のアプリの名前＞.herokuapp.com/ deployed to Heroku
※自分は、今回デプロイするときのアプリの名前を指定してなかったので、
enigmatic-reaches-21915
という名前になっています。
③参考記事
(2).デプロイは成功し、正しいURLにアクセスしたが、エラー画面が表示される問題
①エラー現象
正しいURLにアクセスした時、以下のようなエラー画面が表示される。
"We're sorry, but something went wrong."
画像
https://gyazo.com/3a6a0c733d87efe0866c2e3f8d585a0f
②解決方法
デプロイをした後に、本番環境においてマイグレーションを行えば、解決できます。
③参考記事
https://i.gyazo.com/3a6a0c733d87efe0866c2e3f8d585a0f.png
https://qiita.com/KazuhoE/items/06d13ccd4c72fd31c5d9
https://teratail.com/questions/124183
4.デプロイ手順の参考記事
・https://qiita.com/NaokiIshimura/items/eee473675d624a17310f
・https://qiita.com/kazukimatsumoto/items/a0daa7281a3948701c39
・https://sweets-engineer.com/heroku/#heroku
・https://qiita.com/fuwamaki/items/f7752eb7a2727660239f