今 Rails 6.1 で rails new をすると発生するエラーとその対処法

Rails 6.1 のチュートリアル通りに実装していたらエラーに遭遇した。他のバージョンのRailsで発生するかは未検証。

エラーの概要

rails newでプロジェクトを作成し、Controllerを作ってアクセスするとエラーになる。

例えば、以下のコマンドを実行した後で http://localhost:3000/home/index にアクセスするとエラーになる。

rails new blog
cd blog
bin/rails g controller home index
bin/rails s

エラーの内容は以下の通り。

Webpacker::Manifest::MissingEntryError in Home#index

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:
{
}

暫定的な対処法

yarn add -D @babel/plugin-proposal-private-methods @babel/plugin-proposal-private-property-in-object
bin/rails webpacker:install
bin/rails webpacker:compile

エラーの原因

(参考)

Babelのコントリビュータによれば、rails newコマンドで生成されるプロジェクトのBabel関連の設定に問題があるらしい。
Babel のプラグインのうち、"@babel/plugin-proposal-"で始まるものは明示的に npm install しなければならないが、Rails 6.1 のデフォルトプロジェクトではインストールされていない。
これまではインストールされている他パッケージが依存していたために動いていたが、アップデートにより依存しなくなったことで、エラーが発生するようになったと考えられる。

参考

• https://github.com/babel/babel/issues/15679
• https://devcenter.heroku.com/articles/getting-started-with-rails6