🔷注意

本エラーは、「Bootstrap5」+「Rails6」の環境で発生する模様

✅当方の環境

開発環境 : Docker
本番環境 : heroku
Gemfileの内容
- ruby 2.7.5
- rails 6.1.5
- webpacker 5.0

✅関連キーワード

%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
Bootstrap導入したらエラーが発生
Webpaker::Manifest::MissingEntryError
status=500
「application.html.erb」でエラーが発生
Herokuデプロイ時のエラー

✅エラー内容

Herokuのログの内容（heroku logs -t -a アプリ名）※一部抜粋

Started GET "/" for at 2022-04-12 07:59:45 +0000
 Processing by TopController#index as HTML
 Rendered top/index.html.erb within layouts/application (Duration: 0.7ms | Allocations: 292)
 Rendered layout layouts/application.html.erb (Duration: 1.8ms | Allocations:

 Completed 500 Internal Server Error in 7ms (Allocations: 2415)

 ActionView::Template::Error (Webpacker can't find application.css in /app/public/packs/manifest.json. Possible causes:
 1. You want to set webpacker.yml value of compile to true for your environment
 unless you are using the `webpack -w` or the webpack-dev-server.
 2. webpack has not yet re-run to reflect updates.
 3. You have misconfigured Webpacker's config/webpacker.yml file.
 4. Your webpack configuration is not creating a manifest.
 Your manifest contains:

✅エラー箇所

app\views\layouts\application.html.erb

<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %> #この行でエラーが発生している

✅エラー発生状況/経緯

Herokuのみでエラーが発生
ローカル（Docker）では、エラーは発生していない
BootstrapのCSSをWebpackerで導入(yarnで実施)してからエラーが発生
BootstrapをCDNで導入した場合は、Herokuではエラーが発生していない

✅エラー原因

Webpackerの動作が、ローカル環境(development)と本番環境（production）で違うから

✅エラー対応

Webpackerの動作を、ローカル環境(development)と本番環境（production）共に一緒にする

config\webpacker.yml

production:
 <<: *default

　　compile: true
　　extract_css: false
　　cache_manifest: false

「production」の下部にある設定を修正してください

🔴補足：上記3つの説明

オプション	true	false
compile	Railsページが読み込まれると必要に応じて自動的にコンパイル	手動でコンパイルが必要
extract_css	linkを出力	JavaScriptを使って動的にCSSを読み込む
cache_manifest	manifest.json の読み込み	manifest.json の読み込まない

✅エラー参考資料