Bootstrap with Rails 7 with importmap

Probably lot of us are banging my head to install bootstrap with rails 7.

1. I have a app created fresh with Rails 7.1.2.
   rails new my_app

2. Add gems

gem "sassc-rails"
gem "bootstrap"

3. in app/assets/stylesheets/application.css, rename it to .scss extension

4. then add following, delete everything

@import "bootstrap";

5. in config/initializers/assets.rb, add this

Rails.application.config.assets.precompile += %w( bootstrap.min.js popper.js )

6. pin the compiled asset in config/importmap.rb:

pin "popper", to: 'popper.js', preload: true
pin "bootstrap", to: 'bootstrap.min.js', preload: true

7. app/javascript/application.js, add

import "popper"
import "bootstrap"

and thats it.