Stimulus Controllerの作り方

bin/rails g stimulus [controller名]

Railsのたいていのものはコピペで作れます。例えばRailsのControllerを増やすときは、すでにあるコントローラをコピペして、名前を何箇所か変更するだけで十分です。常にbin/rails g controller [controller名]とはしません。

しかしStimulusの場合は、常にbin/rails g stimulus [controller名]でcontrollerを増やすべきです。Stimulus Controllerをコピペしただけでは、読み込まれないことがあるためです。以下に解説します

controllerの自動ロード

Stimulus controllerはapp/javascript/controllersフォルダに置きます。Railsデフォルトのimport map、もしくはWebpackでビルドしてStimulus webpack helpersを使っているときは、このフォルダに配置されたStimulus controllerは自動的に読み込まれます。

しかしそれ以外のビルドシステムを使っている場合（例えばjsbundling-railsでesbuildを使用している場合）は、自動ローディングしてくれません。

この場合はapp/javascript/controllers/index.jsに各コントローラを登録する必要があります。bin/rails g stimulus [controller名]をすると、この辺りを自動的にやってくれます。また作りそびれた場合は後でbin/rails stimulus:manifest:updateとやれば作り直してくれます。

詳しくは公式ドキュメントをご確認ください。

// This file is auto-generated by ./bin/rails stimulus:manifest:update
// Run that command whenever you add a new controller or create them with
// ./bin/rails generate stimulus controllerName

import { application } from "./application"

import AccordionController from "./accordion_controller"
application.register("accordion", AccordionController)

// ...

まとめ

• Webpackではないビルドシステムを使用している場合は app/javascript/controllers/index.jsに新しいcontrollerを登録する必要があります。bin/rails g stimulus [controller名]ならこれを自動的にやってくれますので、なるべくこのコマンドで作ってください
• なおimport mapsやWebpackを使っている場合はこの限りではないのですが、なるべく統一した方が良いと思いますので、その時もbin/rails g stimulus [controller名]を使うことをお勧めします
• 作りそびれた場合はbin/rails stimulus:manifest:updateをやれば、自動的に登録をアップデートしてくれます