【Rails】ファイルに書いたjQueryが読み込まれないときの対処法

初歩的なところで毎度ハマっています。

今回の事象

test.jsをapp/assets/javascripts配下に配置して以下の簡単なalertを出すだけのメソッドでテスト。
gemのインストールは終わっている前提です。

$(document).ready(function() {

  $('#aaa').on('click', function() {
    alert("クリックされました");
  });

});

が、しかし動かない。

原因

application.jsに記載したrequireの順序でした。

↓これじゃ動かない

//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require_tree .
//= require jquery
//= require jquery_ujs

↓これで動く。jQueryの読み込み位置に注目。

//= require rails-ujs
//= require jquery
//= require jquery_ujs
//= require activestorage
//= require turbolinks
//= require_tree .

理由

jQueryはturbolinksよりも先に読み込ませる必要があるそうです。

以上。

Ruby on Rails 5アプリケーションプログラミング