【Rails】JavaScriptが読み込まれなかったとき

app/assets/javascripts/application.jsに書いたJavaScriptは実行されるのに、他の.jsファイルに書いたJavaScriptは実行されませんでした。
その原因はrequireの順番が間違っていたことでした。

バージョン

Ruby: 2.5.1
Rails: 5.2.3
jquery-rails: 4.3.3
Bootstrap: 4.3.1

エラーメッセージ

ChromeDeveloperToolsで読み込まれているJavaScriptを確認したところ、以下のようなエラーが出ていました。

Uncaught ReferenceError: $ is not defined

対応

JQueryがまだ読み込まれていないと言われているので、app/assets/javascripts/application.jsを以下のように修正しました。

# Before
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require_tree .
//= require jquery3
//= require popper
//= require bootstrap-sprockets

# After
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require jquery3
//= require popper
//= require bootstrap-sprockets
//= require_tree .