Bootstrap 4.6.2 popper issue

[helmutrs]

Ruby 3.1.3
Rails 7.0.4.3

using import maps and sprockets (without nodejs).

gem 'bootstrap', '~> 4.6', '>= 4.6.2'

there is an issue with popper: undefined is not an object (evaluating 'e.Popper=t()')

when change to bootstrap 5v, the issue disappear. (same config just different gem version)

config/importmap.rb
pin 'popper', to: 'popper.js', preload: true
pin 'bootstrap', to: 'bootstrap.min.js', preload: true

app/assets/stylesheets/application.scss

@import 'bootstrap';

app/javascript/application.js:

//= require jquery3
//= require popper
//= require bootstrap

[HiGitHubH]

I also met this problem. Has it been solved?

[nbaki]

I was seeing the same Popper JS error and noticed that my project was loading Bootstrap 5 instead of 4, regardless of my //= require bootstrap. It turns out there was a lingering bootstrap npm package in my node_modules folder that is also including in the asset paths, this was trumping this gem's assets because of the order of load.

Hopefully this information helps others!

[rahulbir]

Also seeing this issue, did anyone find a fix?

[rahulbir]

I was able to work around this bug by using the bundled JS version of Bootstrap (bootstrap.bundle.min.js) this file includes Popper but not JQuery.

Gemfile

gem 'bootstrap', '~> 4.6.2'  # Used for SCSS 

application.scss

@import 'boostrap';

Importmap

pin 'jquery', to: 'jquery3.min.js', preload: true
pin 'bootstrap', to: 'https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js', preload: true

asset.rb

Rails.application.config.assets.precompile += [
  'jquery3.min.js',
  'bootstrap.bundle.min.js'
]

application.js

import 'jquery';
import 'bootstrap';

Hope this helps!