rails7: 使用 jsbundling-rails/esbuild/hotwired/turbo

添加 js 功能，让自己的 rails 应用支持一些基本的 ajax 操作

创建项目 css/js 默认初始化

可以在刚开始创建项目时，就以这种方式创建

# 创建的几种方式
rails new myapp --css=sass --javascript=esbuild
rails new myapp -j [bun|esbuild|rollup|webpack].

---

添加 jsbunding-rails

如果没有默认用 esbuild 就用这种试

其实就是添加 gem "jsbundling-rails", "~> 1.2" 这一行

# 选一个 ./bin/rails javascript:install:[bun|esbuild|rollup|webpack]

# 添加 jsbundling-rails
bundle add jsbundling-rails
# 安装
bin/rails javascript:install:esbuild

添加 hotwired/turbo 组件

• 安装包
• 添加基本的文伯

yarn add @hotwired/stimulus @hotwired/turbo-rails
bin/rails turbo:install stimulus:install

启动开发模式

使用了这些工具之后，就不能只用 rails server 来开发项目了，需要用 bin/dev，配合 rubymime 来开发。

./bin/dev

参考

• https://github.com/hotwired/turbo-rails
• https://github.com/rails/jsbundling-rails
• https://hotwired.dev/#screencast
• https://www.hotrails.dev/turbo-rails/turbo-rails-tutorial-introduction
• https://medium.com/@rwubakwanayoolivier/using-esbuild-and-bootstrap-in-a-rails-7-project-by-replacing-the-default-importmap-cfc1f54e83ce
• https://ryanbigg.com/2023/04/rails-7-bootstrap-css-javascript-with-esbuild
• https://stackoverflow.com/questions/74922423/how-to-load-custom-js-in-rails-7-esbuild-project