ポートフォリを作成中にAjaxで路頭に迷ったので、未来の自分のためにこの記事を残しておこうと思います。
jQuery関係##
jQueryのライブラリをインストール
$ yarn add jquery@3.4.1
Webpackの環境編集
config/webpack/environment.js
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
application.jsに追加
app/javascript/packs/application.js
require("jquery")
ブラウザ関係##
ブラウザ側でjavascriptが無効になっていた場合でもAjaxが起動するために
config/application.rb
module "アプリ名"
class Application < Rails::Application
.
.
.
# これを追加!
config.action_view.embed_authenticity_token_in_remote_forms = true
end
あとは書きまくるだけ!!