twbs / bootstrap-rubygem

Bootstrap rubygem for Rails / Sprockets / Hanami / etc
https://rubygems.org/gems/bootstrap
MIT License
2.02k stars 447 forks source link

Importmaps Documentation #258

Closed kevinvangelder closed 1 year ago

kevinvangelder commented 1 year ago

It seems like some information is missing from the Importmaps documentation. I've done everything in the steps and also added the following lines to app/javascript/application.js but my dropdowns are not functioning (I even copy/pasted the code from the docs to be sure):

import "bootstrap"
import "popper.js"

config/importmap.rb:

pin "bootstrap", to: "bootstrap.min.js", preload: true
pin "@popperjs/core", to: "popper.js", preload: true

config/initializers/assets.rb

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

app/views/layouts/application.html.slim

= javascript_importmap_tags

I know this is probably a really stupid question, but I've been going crazy trying to get this to work.

Note: jquery does appear to be loading, also via importmaps, so it does seem to be something specific to this library.

kevinvangelder commented 1 year ago

I was eventually able to work around this issue by installing via webpacker instead, but only thanks to external documentation.

degendra commented 8 months ago
import "@popperjs/core"
import "bootstrap"

Importing @popperjs/core and bootstrap in the application.js should fix the issue.

kyryloliinyk commented 3 months ago

I faced the same issue and it worked for me after I made next settings: Gemfile:

gem 'bootstrap', '~> 5.3.3'

assets/stylesheets/application.scss:

@import "bootstrap";

javascript/application.js:

import "bootstrap"

config/importmap.rb:

pin "bootstrap", to: "https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js", preload: true

initialiers/assets.rb:

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