Bootstrap not working about importmap-rails

[guybedford]

@omairrazam Bootstrap as imported there is a "script" not a "module". In modules, the this binding is not the global object but undefined, so this.bootstrap = Bootstrap fails.

Either load that file as a script, or use a version of Bootstrap that works as a module. For example via a module CDN which can handle this conversion process.

[ianneub]

@omairrazam I had some issues getting bootstrap and popper working with Rails 7.0.0.alpha2, finally fixed them by changing the relevant entries in ./config/importmap.rb to:

pin "bootstrap", to: "https://ga.jspm.io/npm:[email protected]/dist/js/bootstrap.esm.js"
pin "@popperjs/core", to: "https://ga.jspm.io/npm:@popperjs/[email protected]/dist/esm/index.js"

edit: those are newer versions of Bootstrap and Popper. I'm not sure if Bootstrap has an ESM ready version for 4.0.0.

[bensheldon]

@ianneub Do dropdowns work when you import the esm version of Bootstrap? I am only successful when pinning the bundle version that includes Popper, e.g.:

pin "bootstrap", to: "https://ga.jspm.io/npm:[email protected]/dist/js/bootstrap.bundle.min.js"

Bootstrap's docs seem to imply that the dropdowns don't work for the esm version:

Due to browser limitations, some of our plugins, namely Dropdown, Tooltip and Popover plugins, cannot be used in a <script> tag with module type because they depend on Popper. For more information about the issue see here.