rails に yarn で jquery を導入

おじさんが若い頃は、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 があるかどうか確認してみい)

なので、どんな場合でも