rails7のimportmapでjavascriptファイルの読み込み

RubyOnRailsによるwebサービス開発

2023-10-17

マーケター、エンジニアを月1時間からジョインできるプラットフォーム

airteamは月1時間からマーケターやエンジニアに相談できるプラットフォーム。雇うのはハードル高いけどプロをチームに入れたい。そんな経営者のためのサービスです。相談にのる方も募集しています。

タスクなしだから月一時間からジョイン可能

作業はなくオンライン相談メイン。月1時間からさっと経験者に継続的に相談できます。

多様な経験者を雇用するより何倍も早くチームに

あらゆるジャンルの経験者がいるのであなたのチームのノウハウの選択肢が広がります。

NDAはすでに締結済み、契約もスムーズ

契約の煩雑なやりとりはなく、NDAはすでに締結済み、書面のやりとりはありません。

rails7でimportmap経由でjavascriptファイルを読み込む際の手順をまとめていきます。

config/importmap.rb

pin "hello", to: "hello.js"

上記でapp/javascriptフォルダのhello.jsを読み込む。

下記でimportmapを読み込み。headにかく。

<%= javascript_importmap_tags %>

下記コードをviewに記載し、helloファイルを読み込む

<script type="module">
      import "hello";
 </script>

app/javascript/hello.js

にコードを書く。