1. 開発環境の情報

開発環境 : Docker
本番環境 : heroku
Gemfileの内容
- ruby 2.7.3
- rails 6.1.3
- webpacker 5.4

2. エラー内容

エラーの内容は, herokuへデプロイ後にアプリを開こうとすると「Webpacker::Manifest::MissingEntryError in StaticPages#home」と表示されて表示することができない状況

引っかかっている原因のコードは <%= javascript_pack_tag 'application', 'data-turbolinks-track':'reload' %>

また、heroku logs --tailでherokuのログを確認したところアプリのビルドはできている模様。

スクショ
翻訳前の画面

Webpacker can't find application.js in /myapp/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:
{
}

翻訳後の画面

webpackerは/myapp/public/packs/manifest.jsonの中でapplication.jsを見つけることができません

可能性のある原因:
1. あなたが'webpack -w'かwebpack-deb-serverを使用しているのではない限り, webpacker.ymlのcompileの値を環境に合わせてtrueに設定してください。
2. webpackはアップデートを反映するための再実行がまだされていない
3. あなたは webpackerのconfig/webpacker.ymlファイルの設定が間違っています
4. あなたのwebpackの設定はmanifestを作っていません

あなたのmanifestが含んでいるもの:
{
}

現時点でできること

ローカル環境では普通に動く。
- つまりwebpack-deb-serverは動く
javascript pack tagをapplication.html.erbから排除すると、トップページが表示される。しかし、javascriptが効いていないのか、ローカル時と異なる挙動をする

3. エラーに関係する記事と解決方法まとめ

自分の場合
herokuにプッシュするブランチをトピックブランチではなくマスターブランチに変更したら, 何故か動いた(原因不明)。

git push heroku <branch_name>:master
↓
git push heroku master

Qiita, Webpacker::Manifest::MissingEntryError, 2021年12月21日更新
- 原因: nodejsを管理するyarnがインストールされていない
- 解決策: docker-compose run --rm web yarn install
Rails：Webpacker4.2は/app/public/packs/manifest.jsonherokuでアプリケーションを見つけることができません
- 解決策1
  - extract_css: false (webpacker.yml)
  - <%= stylesheet_pack_tag 'application' %> をapplication.html.erbから削除する
  - import '../stylesheets/application'をapplication.jsに追加
- 解決策2
  - app/javascriptにapplication.jsを置く
  - stylesheetsをassetsから読み込ませたい場合は config/webpacker.ymlにresolved_paths: ['app/assets']を追加数r
  - app/javasvript/packs/application.jsに以下の行をコピーするimport 'stylesheets/application'
- 解決策3
  - bundle exec rails webpacker:install
- 解決策4
  - webpackerの再インストール bundle exec rails webpacker:install
  - ローカルと本番環境の両方でアセットを再コンパイルする
    - rails assets:precompile
    - rails assets:precompile RAILS_ENV=production
  - rm -rf node_modules
  - rails assets:clobber
  - rails assets:precompile
  - rails assets:precompile RAILS_ENV=production
  - config/environments/production.rbに
    config.assets.compile = false
Ruboty | Heroku にデプロイした ruboty のプロセスが status 143 で exit してしまう #ruboty #heroku
- 解決策 : heroku restartをしまくる
Railsで1日以上詰まったエラー
- rails webpacker:install
  rails
- webpacker:compile
Rails Webpacker compile error on Production enviorment
- 解決策1
  - yarn add @rails/webpacker
  - bundle update webpacker
- 解決策2
  - rm -rf bin/webpack*
  - rails webpacker:install
  - RAILS_ENV=production rails webpacker:compile
    - 使えなかったので、次のコードを実行。rails webpacker:compile RAILS_ENV=production
Webpackerがmanifest.json Heroku Productionでapplication.jsを見つけることができません
- 解決策1
  - webpacker 3.5をインストールする
    - gemfileのwebpackerのヴァージョンを最新(5.4)から3.5にした。4.0.7でも試した。
- 解決策2
  - フォルダnode_modulesを削除
  - yarn add @Rails/webpacker@next
  - bundle exec Rails webpacker:install

デプロイ関連の記事

webpacker関連の記事

webpack公式ドキュメント