Q&A
gemの一覧とviewのapplication.html.erbを見せていただけますか？
前提・実現したいこと
railsのアプリをherokuに正常にデプロイしたのち、起動しようとしたところ
We're sorry, but something went wrong.
と表示されアプリが起動しませんでした。
発生している問題・エラーメッセージ
heroku logsでエラーメッセージを探りました。
直接エラーに関する記述があると思われるのは以下の二箇所です（抜粋）。
2020-04-13T12:16:43.617300+00:00 heroku[router]: at=info method=GET path="/" host=portgram.herokuapp.com request_id=749089d5-314b-4500-a291-79093b380583 fwd="#.#.#.#" dyno=web.1 connect=0ms service=17ms status=500 bytes=1891 protocol=https
2020-04-13T12:16:43.615578+00:00 app[web.1]: [749089d5-314b-4500-a291-79093b380583] ActionView::Template::Error (Webpacker can't find custom.css in /app/public/packs/manifest.json. Possible causes: 2020-04-13T12:16:43.615578+00:00 app[web.1]: 1. You want to set webpacker.yml value of compile to true for your environment 2020-04-13T12:16:43.615579+00:00 app[web.1]: unless you are using the `webpack -w` or the webpack-dev-server. 2020-04-13T12:16:43.615580+00:00 app[web.1]: 2. webpack has not yet re-run to reflect updates. 2020-04-13T12:16:43.615580+00:00 app[web.1]: 3. You have misconfigured Webpacker's config/webpacker.yml file. 2020-04-13T12:16:43.615581+00:00 app[web.1]: 4. Your webpack configuration is not creating a manifest. 2020-04-13T12:16:43.615582+00:00 app[web.1]: Your manifest contains: 2020-04-13T12:16:43.615583+00:00 app[web.1]: { 2020-04-13T12:16:43.615583+00:00 app[web.1]: "application.js": "/packs/js/application-4d27ebdb93ef082d62d3.js", 2020-04-13T12:16:43.615584+00:00 app[web.1]: "application.js.map": "/packs/js/application-4d27ebdb93ef082d62d3.js.map", 2020-04-13T12:16:43.615584+00:00 app[web.1]: "entrypoints": { 2020-04-13T12:16:43.615584+00:00 app[web.1]: "application": { 2020-04-13T12:16:43.615585+00:00 app[web.1]: "js": [ 2020-04-13T12:16:43.615585+00:00 app[web.1]: "/packs/js/application-4d27ebdb93ef082d62d3.js" 2020-04-13T12:16:43.615585+00:00 app[web.1]: ], 2020-04-13T12:16:43.615586+00:00 app[web.1]: "js.map": [ 2020-04-13T12:16:43.615586+00:00 app[web.1]: "/packs/js/application-4d27ebdb93ef082d62d3.js.map" 2020-04-13T12:16:43.615587+00:00 app[web.1]: ] 2020-04-13T12:16:43.615587+00:00 app[web.1]: } 2020-04-13T12:16:43.615587+00:00 app[web.1]: } 2020-04-13T12:16:43.615588+00:00 app[web.1]: } 2020-04-13T12:16:43.615588+00:00 app[web.1]: ):
試したこと
500エラーが発生していることと、webpackerがcustum.cssをmanifest.json内で見つけられずにエラーが発生していることは読み取れました。
しかし、以下の方法を試しましたが、効果は見られませんでした。
・webpacker.yml内の
production: <<: *default compile: false ```falseをtrueに変更 ・webpackerをbundle update ・environments/production.rb内の
config.public_file_server.enabled = ENV['RAILS_SERVE_STATIC_FILES'].present?
config.public_file_server.enabled = true
その他、以下の記事を参考にしましたが、効果なしでした。 https://stackoverflow.com/questions/47377494/webpack-error-on-heroku-deployment https://stackoverflow.com/questions/51179635/webpacker-cant-find-application-js-in-manifest-json-heroku-production https://teratail.com/questions/173217 https://qiita.com/suzy1031/items/b159a161f7dff6dbb645 ### 補足情報（FW/ツールのバージョンなど） 関係ありそうなものを抜粋します。 rails (6.0.2.1) webpacker (5.0.1) ご回答のほどお待ちしております。よろしくお願いいたします。 ### 追記 以下、追記いたします。 gem ```Gemfile source 'https://rubygems.org' git_source(:github) { |repo| "https://github.com/#{repo}.git" } ruby '2.6.3' gem 'rails', '~> 6.0.2', '>= 6.0.2.1' gem 'bcrypt' gem 'faker' gem 'carrierwave' gem 'mini_magick' gem 'will_paginate' gem 'bootstrap-will_paginate' gem 'puma', '~> 4.1' gem 'bootstrap-sass' gem 'sass-rails', '>= 6' gem 'bootstrap' gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby] gem 'webpacker' gem 'turbolinks', '~> 5' gem 'jbuilder', '~> 2.7' gem 'bootsnap', '>= 1.4.2', require: false gem 'rails-i18n' gem 'counter_culture' group :development, :test do gem 'byebug', platforms: [:mri, :mingw, :x64_mingw] gem 'rspec-rails' gem 'sqlite3', '~> 1.4', require: false gem 'factory_bot_rails' end group :development do gem 'web-console', '>= 3.3.0' gem 'listen', '>= 3.0.5', '< 3.2' gem 'spring' gem 'spring-watcher-listen', '~> 2.0.0' end group :production do gem 'pg' gem 'fog' end
application.html.erb
<!DOCTYPE html> <html> <%= render 'layouts/head' %> <body> <%= render 'layouts/header' %> <div class="container"> <% flash.each do |message_type, message| %> <div class="alert alert-<%= message_type %>"><%= message %></div> <% end %> <%= yield %> <%= debug(params) if Rails.env.development? %> </div> </body> </html>
_head.html.erb
<head> <title><%= full_title(yield(:title)) %></title> <%= csrf_meta_tags %> <%= csp_meta_tag %> <%= stylesheet_pack_tag 'custom', media: 'all', 'data-turbolinks-track': 'reload' %> <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %> <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %> <%= render 'layouts/shim' %> </head>
no1knows様
追記いたしました。
ご確認をお願いいたします。
hoshi-takanori様
助言いただきありがとうございました！
解決いたしました！
回答1件
0
ベストアンサー
解決いたしました。
方法としては、webpackerを使用せずcssを読み込む方法に変更しました。
具体的には、_head.html.erbで
<head> <title><%= full_title(yield(:title)) %></title> <%= csrf_meta_tags %> <%= csp_meta_tag %> <%= stylesheet_pack_tag 'custom', media: 'all', 'data-turbolinks-track': 'reload' %> <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %> <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %> <%= render 'layouts/shim' %> </head> ```とあったところ、上から５行目の"stylesheet_pack_tag"を"stylesheet_link_tag"と変更しました。 その結果、herokuでも問題なくアプリが起動し、表示も問題ないものになりました。
投稿2020/04/14 00:17
退会済みユーザー
総合スコア0
解決してよかったです！
Rails6ではbootstrapやjQueryを読み込むときはyarnコマンドで実行するのが通常の流れのようです。
次回以降は、そこらへんも気をつけておくと良いかもしれません。
あと細かいところだとgem bootstrapとgem bootstrap-sassは、バージョンによってどちらかを利用すればよいです。
bootstrap4ならgem bootstrapだけ、bootstrap2,3ならgem bootstrap-sassです。
詳しくは下記の3行目くらいに記載がありますので確認いただくとよいかと思います。
https://github.com/twbs/bootstrap-rubygem
no1knows様
丁寧に補足までいただきありがとうございます！
readme読んでませんでした・・・
今後はこの点にも気をつけていきます。
あなたの回答
tips
プレビュー
