初めに

Rails7 では、importmap-railsが標準で利用できるようになりました。

webpackerやjsbuilding-railsなどと違い、javascript モジュールをブラウザに直接インポートされます。

importmap-railsは他と違い注意しないといけない点があるので、忘備録として記事にしておきます。

注意点

importmapは javascript パッケージを追加するためには、以下のようにします。

$ bin/importmap pin [パッケージ名]
Pinning [パッケージ名] to [パッケージURL]

といった形で、パッケージを追加していきます。
importmapで利用できるのは npm から取得できるパッケージ JavaScript CDN 経由で利用できるものだけです。

webpackのようにコンパイルなどを行わなず、ブラウザに直接インポートされます。
なので、JSXのような明示的なトランスパイルやコンパイルのステップが必要である場合はimportmap-railsでは利用できない。

npm updateなどのようにパッケージをまとめてアップデートできませんが、下記のようなコマンドを使うことで新しいバージョンが存在するかを確認できます。

$ ./bin/importmap outdated
新しいバージョンのnpmレジストリをチェックします

$ ./bin/importmap audit
既知のセキュリティ問題についてnpmレジストリをチェックします

--downloadオブションを指定することで、パッケージをローカルにインストールできます。

bin/importmap pin [パッケージ名] --download

vender/javascriptディレクトリにインストールされる。