エラー内容
Webpacker::Manifest::MissingEntryError in ***#***
Showing /***/app/views/layouts/application.html.erb where line #10 raised:
Webpacker can't find application.js in /***/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:
{
}
Extracted source (around line #10):
Extracted source (around line #10)
<%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
</head>
<body>
やっていた操作
-
ローカルPC(Macbook Air M2)と異なる開発環境（AWS Cloud9）でRailsアプリケーションを作成した
-
Cloud9からGitHubへPushした
-
リポジトリをローカルPC上にcloneした
Macbook Air M2のターミナル
% git clone git@github.com:***/***.git
- Gemをインストールした
Macbook Air M2のターミナル
% bundle install
- webpackerをインストールした
Macbook Air M2のターミナル
% rails webpacker:install
- マイグレーションした
Macbook Air M2のターミナル
% rails db:migrate
-
rails sを実行し、ブラウザでhttp://localhost:3000/へアクセス
以上の操作でWebpacker::Manifest::MissingEntryErrorエラーが発生しました。
結論
Node.jsのバージョンが異なっていたことが原因でした。WebpackerはNode.jsを使用しているためバージョンの違いが影響していたようです。
Macbook Air M2のターミナル
% node -v
v18.12.1
AWS Cloud9のターミナル
$ node -v
v16.19.0
気づいたきっかけ
ターミナルのエラーを見てみたところ、webpackerのコンパイルで失敗していました。
Compiling...
Compilation failed:
node:internal/crypto/hash:71
this[kHandle] = new _Hash(algorithm, xofLen);
^
Error: error:0308010C:digital envelope routines::unsupported
at new Hash (node:internal/crypto/hash:71:19)
at Object.createHash (node:crypto:133:10)
at module.exports (/***/node_modules/webpack/lib/util/createHash.js:135:53)
at NormalModule._initBuildHash (/***/node_modules/webpack/lib/NormalModule.js:417:16)
at handleParseError (/***/node_modules/webpack/lib/NormalModule.js:471:10)
at /***/node_modules/webpack/lib/NormalModule.js:503:5
at /***/node_modules/webpack/lib/NormalModule.js:358:12
at /***/node_modules/loader-runner/lib/LoaderRunner.js:373:3
at iterateNormalLoaders (/***/node_modules/loader-runner/lib/LoaderRunner.js:214:10)
at iterateNormalLoaders (/***/node_modules/loader-runner/lib/LoaderRunner.js:221:10)
at /***/node_modules/loader-runner/lib/LoaderRunner.js:236:3
at context.callback (/***/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
at /***/node_modules/babel-loader/lib/index.js:44:71
at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
library: 'digital envelope routines',
reason: 'unsupported',
code: 'ERR_OSSL_EVP_UNSUPPORTED'
}
Node.js v18.12.1
試しにchatGPTに聞いてみたところ、
このエラーは、Node.jsのバージョンが古いために起こっている可能性があります。Node.jsの最新バージョンをインストールすることで解決することができます。
Node.jsのバージョンはむしろCloud9より新しいのですが、どうやらWebpackerが使用しているNode.jsのバージョンが影響していることはこれでわかりました。
対処
ローカルPC(Macbook Air M2)のNode.jsバージョン(v18.12.1)をCloud9と同じバージョン(v16.19.0)にダウングレードしました。以下が手順です。nvmというNode.jsのバージョン管理ツールを使用します。
- まず
nvmがインストールされているか確認
% nvm -v
バージョンが表示されればインストール済みです。
-
nvmがインストールされていない場合はインストールする
以下のコマンドは記事を書いた時点でのバージョンなので、最新のnvmにしたい場合はnvmの公式ドキュメントからインストールコマンドをコピーしてきた方が良いでしょう。
% curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.3/install.sh | zsh
- ターミナルを再起動して、nvmがインストールされたか確認
% nvm -v
0.39.3
一応nvmの各種確認コマンドを載せておきます。
# インストール可能バージョンの確認
nvm ls-remote
# インストール済みのnodeのバージョン一覧を表示
nvm ls
- Node.jsのバージョンを指定（v16.19.0）してインストール
% nvm install v16.19.0
- Node.jsのバージョン確認
% node -v
v16.19.0
私の場合はこの時点でバージョンが切り替わっていました。
- もしバージョンが変わっていなければバージョンを変更
% nvm use v16.19.0
% node -v
v16.19.0
- 改めてWebpackerをインストール。
% rails webpacker:install
以上でエラーが解消されました。
Node.js以外の環境
% ruby -v
ruby 3.1.2p20 (2022-04-12 revision 4491bb740a) [arm64-darwin22]
% rails -v
Rails 6.1.7
% bin/webpack -v
4.46.0
% nvm -v
0.39.3
参考