このページの内容は以下のリポジトリに1日遅れで反映されます(記事執筆前に前日分をコミットしています)。
https://github.com/hkob/hkob_blog
はじめに
Rails Tips の 62 回目です。rails インストール時に bundle をスキップしたせいなのか、javascript などの設定までもがスキップされていたようです。
importmap のインストール
まず、importmap がインストールされていないようなので、まず rails で importmap をインストールしました。すでに haml 化してしまったので、application.html.erb が修正できなかったとエラーになっています。
$ bin/rails importmap:install
apply /Users/hkob/.rbenv/versions/3.3.0/lib/ruby/gems/3.3.0/gems/importmap-rails-2.0.1/lib/install/install.rb
Default application.html.erb is missing!
Add <%= javascript_importmap_tags %> within the <head> tag in your custom layout.
Create application.js module as entrypoint
create app/javascript/application.js
Use vendor/javascript for downloaded pins
create vendor/javascript
create vendor/javascript/.keep
Configure importmap paths in config/importmap.rb
create config/importmap.rb
Copying binstub
create bin/importmap
run bundle install
Bundle complete! 21 Gemfile dependencies, 122 gems now installed.
Use `bundle info [gemname]` to see where a bundled gem is installed.
run bundle lock --add-platform=x86_64-linux
Writing lockfile to /Users/hkob/Library/CloudStorage/Dropbox/rails/hkob_blog/Gemfile.lock
run bundle lock --add-platform=aarch64-linux
Writing lockfile to /Users/hkob/Library/CloudStorage/Dropbox/rails/hkob_blog/Gemfile.lock
このため、application.html.haml に javascript_importmap_tags を追加しました。
= javascript_importmap_tags
= stylesheet_link_tag "application", "data-turbo-track": "reload"
最後に turbo と stimulus もインストールします。これで hotwire のインストールが完了になります。
$ bin/rails turbo:install:importmap stimulus:install:importmap apply /Users/hkob/.rbenv/versions/3.3.0/lib/ruby/gems/3.3.0/gems/turbo-rails-1.5.0/lib/install/turbo_with_importmap.rb Import Turbo append app/javascript/application.js Pin Turbo append config/importmap.rb run bundle install Bundle complete! 21 Gemfile dependencies, 122 gems now installed. Use `bundle info [gemname]` to see where a bundled gem is installed. run bundle lock --add-platform=x86_64-linux Writing lockfile to /Users/hkob/Library/CloudStorage/Dropbox/rails/hkob_blog/Gemfile.lock run bundle lock --add-platform=aarch64-linux Writing lockfile to /Users/hkob/Library/CloudStorage/Dropbox/rails/hkob_blog/Gemfile.lock Run turbo:install:redis to switch on Redis and use it in development for turbo streams apply /Users/hkob/.rbenv/versions/3.3.0/lib/ruby/gems/3.3.0/gems/stimulus-rails-1.3.3/lib/install/stimulus_with_importmap.rb Create controllers directory create app/javascript/controllers create app/javascript/controllers/index.js create app/javascript/controllers/application.js create app/javascript/controllers/hello_controller.js Import Stimulus controllers append app/javascript/application.js Pin Stimulus Appending: pin "@hotwired/stimulus", to: "stimulus.min.js" append config/importmap.rb Appending: pin "@hotwired/stimulus-loading", to: "stimulus-loading.js" append config/importmap.rb Pin all controllers Appending: pin_all_from "app/javascript/controllers", under: "controllers" append config/importmap.rb run bundle install Bundle complete! 21 Gemfile dependencies, 122 gems now installed. Use `bundle info [gemname]` to see where a bundled gem is installed. run bundle lock --add-platform=x86_64-linux Writing lockfile to /Users/hkob/Library/CloudStorage/Dropbox/rails/hkob_blog/Gemfile.lock run bundle lock --add-platform=aarch64-linux Writing lockfile to /Users/hkob/Library/CloudStorage/Dropbox/rails/hkob_blog/Gemfile.lock
この状態でサーバを起動すると削除リンクが機能しました。turbo_confirm も正しく機能し、ダイアログが表示されました。
おわりに
これで Turbo も発火し、単一のデータベースの CRUD が全て完了しました。次は Rails ガイドに戻り、二つ目の関連があるテーブルを追加します。
