おじさんが若い頃は、rails に jquery と言ったら
jquery-rails という gem を使うのが一般的じゃった。
しかし、最近の若いもんは npm という javascript 向けパッケージ管理システムからインストールするようじゃ。
今の jquery-rails の jquery は version 3.2.1 だが、
npm を使うと version 3.3.1 になる。
js のライブラリを gem の更新を待たずに導入できる。
これを使わない手はない。
対象は Rails 5.1 以上じゃ。
Rails 5.1 より前のバージョンの rails を 5.1 以上にアップデートしたときは、bin/yarn ファイルがないことがある。
これがないとproductionでaseet_pilelineに反映されないので適当に rails new して bin/yarn だけ拝借すればいい。
まずyarnコマンドをインストールする
次に railsのフォルダに移動して以下のコマンドを実行するのじゃ
$ cd rails_project $ yarn init
jquery のインストール
$ yarn add jquery
すると node_modules フォルダ以下にインストールされる
これはコミットすべきでないので
.gitignore ファイルに
/node_modules
を追加
さらに asset_pipeline に組み込むために
config/initializers/assets.rb に
Rails.application.config.assets.paths << Rails.root.join('node_modules')
の行を追加
Gemfile から
gem "jquery-rails"
の行を削除
app/assets/javascript/application.js の
//= require jquery
を
//= require jquery/dist/jquery
に変更する
一部の情報では、node_modulesの場合でも
//= require jquery
で読み込めると書いてあるが、これは正確ではない
確かに読み込める場合もあるが、それは jquery-rails の gem が全く存在しない場合じゃ。
Gemfile の中で jquery-rails を削除していたとしても、関連モジュールが jquery-rails に依存していたらダメじゃ。
その jquery-rails が読み込まれてしまう。(Gemfile.lock の中に jquery-rails があるかどうか確認してみい)
なので、どんな場合でも
//= require jquery/dist/jquery
としおけば万事okじゃ。
jqueryのバージョンの確認方法は
ブラウザのコンソールで以下を打てば良い。
console.log($.fn.jquery); 3.3.1
と出力されれば、しめたものじゃ。
