#author("2021-04-07T08:42:43+00:00","default:src128","src128") &tag(Rails6/jQuery); *目次 [#lc695b48] #contents *関連ページ [#b403a336] *参考情報 [#cf7fc130] -[[【Rails6】jQueryがなかなか使い始められない人へ - Qiita:https://qiita.com/iiyama_makoto/items/940b130fd20540fd70f1]] *組み込み手順 [#s0205b8f] -以下のコマンドを実行。 yarn add jquery -webpackの設定ファイルを編集。jqueryのパスは相対パス指定が必要("jquery"のみだと動かない)。 #pre{{ const { environment } = require('@rails/webpacker') //ここから const webpack = require('webpack') environment.plugins.prepend('Provide', new webpack.ProvidePlugin({ $: 'jquery/src/jquery', jQuery: 'jquery/src/jquery' }) ) //ここまで module.exports = environment }} *webpackerで使う [#fcdfcd0b] -app/javascript/packs/application.jsを編集し、以下を追加。 #pre{{ require("@rails/ujs").start() require("turbolinks").start() require("@rails/activestorage").start() require("channels") require("jquery") // ←の1行を追加 // (後略) }} -app/javascript/test.jsを作成 #pre{{ $(function() { console.log("test"); }); }} -application.jsに組み込む。 #pre{{ require("@rails/ujs").start() require("turbolinks").start() require("@rails/activestorage").start() require("channels") require("jquery") require("test.js") // ←の1行を追加 }}