Rails6にJavaScriptのファイルを読み込みたい方に向けてまとめました。
方法
①JSファイルを配置する場所を確認
Rails6の場合、javascript/packs/に配置します。
//以下に配置
javascript/packs/
//フォルダを作成する場合
javascript/packs/フォルダ
②JSファイルを作成する
Javascriptのコードを以下の記述で囲みます。
javascript/packs/xxx.js
document.addEventListener('turbolinks:load', () => {
//ここにjsの記述を追加
})
③JSファイルをapplication.jsでimportをする
最後に、application.jsでインポートします。
ファイル読み込みの記述に注意しましょう。
application.js
//requireの下に配置
//=> javascript/packs/xxx.jsを読み込む
import "./xxx"
//=> javascript/packs/フォルダ名/xxx.jsを読み込む
import "./フォルダ名/xxx"
まとめ
こういった設定でつまづいてしまうことが多々あるので、一つ一つものにしていきたいですね。