Webpacker::Manifest::MissingEntryErrorが発生
Articleモデルのindexビューを作成して、表示させようとしたらWebpacker::Manifest::MissingEntryErrorが生じました。
Webpacker::Manifest::MissingEntryError in Atricles#index
Showing /Users/app/views/layouts/application.html.erb where line #9 raised:
Webpacker can't find application.js in /Users/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:
{
}
webpakerをインストールして、compileすれば良いみたいなので、下記を実行してエラー等生じなければ、問題解決です。
rails webpacker:install
rails webpacker:compile
ただ私はこれらを実行した時に、諸々別のエラーが発生したので、それを以下に記載します。
Webpackerのインストール
まずはwebpakerをインストールします。
rails webpacker:install
すると、下記の通りwebpackのcommandなんてないよと言われました。
error Command "webpack" not found.
gemのwebpackerのバージョンを上げてみます。
Gemfileに変更を加えて、bundle install
gem 'webpacker', '~> 4.0' # 変更前
gem 'webpacker', '~> 5.0' # 変更後
bundle install
もう一度インストールしたら、今度は成功しました。
rails webpacker:install
Webpackerのコンパイル
続いてコンパイルを実行します。
rails webpacker:compile
すると、下記エラーが生じました。
自分のPCにインストールしたNode.jsのバージョン(v17.4.0)では対応していないみたいなので、バージョンを下げる必要があるようです。
Error: error:0308010C:digital envelope routines::unsupported
〜省略〜
Node.js v17.4.0
Completed 500 Internal Server Error in 1994ms (ActiveRecord: 0.2ms | Allocations: 9891)
そもそもNode.jsのバージョン管理ツールを入れていなかったので、このタイミングで入れておきます。
バージョン管理ツールは色々あるみたいですが、今回はnを選択。
npmでnをインストールして、任意のバージョンのNode.jsをインストールします。
npm install -g n
n 15.0.0 #インストール
node -v #バージョン確認
> node/15.0.0
Node.jsのバージョンを下げたので、もう一度コンパイルを実行。
rails webpacker:compile
すると、コンパイルに成功しました。
Webpacker::Manifest::MissingEntryErrorは消え、ビューが上手く表示されました。
おまけ： エラー文に書かれているjavascript_pack_tagの箇所を削除すると・・・
エラー文を読むと、application.html.erbの9行目でエラーが生じていることが分かるので、9行目を削除することでもエラーは生じなくなります。
ただこれをやってしまうと、後々開発に影響が出てくる可能性があります。
例えば、私の場合だと、Action Text(Rails6から追加されたリッチテキスト機能)を使おうとした際に、エディタがうまく表示されなくなるといった問題が生じました。なので、安易に削除するのは良くなさそうです。
1: <!DOCTYPE html>
2: <html>
3: <head>
4: <title>StudyBlogApp</title>
5: <%= csrf_meta_tags %>
6: <%= csp_meta_tag %>
7:
8: <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
9: <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
10: </head>
11:
12: <body>
13: <%= yield %>
14: </body>
</html>
参考
【Rails6】エラーの中身と対処法 Webpacker::Manifest::MissingEntryError in