I am building a Rails 7 project with Rollup as JS bundler and Bootstrap (5.2.3) for styling.
When I try to use any of the Bootstrap modules which depend on Popper (2.11.7), I get an error because Bootstrap seems to imports the Node version of Popper which depends on process.
From the Popper docs (https://popper.js.org/docs/v2/#distribution-targets)
There are two different esm builds, one for bundler consumers (e.g. webpack, Rollup, etc..), which is located under /lib, and one for browsers with native support for ES Modules, under /dist/esm. The only difference within the two, is that the browser-compatible version doesn't make use of process.env.NODE_ENV to run development checks.
In node_modules/bootstrap/dist/js/bootstrap.esm.js, Bootstrap imports Popper through
import * as Popper from '@popperjs/core';
The same also goes for individual modules such as node_modules/js/dist/dropdown.js.
Running in the browser gives the following error message, showing that the imported Popper version is trying to access process.
Uncaught ReferenceError: process is not defined
setOptions createPopper.js:81
createPopper createPopper.js:215
_createPopper bootstrap.esm.js:2186
show bootstrap.esm.js:2077
toggle bootstrap.esm.js:2060
<anonymous> bootstrap.esm.js:2391
handler bootstrap.esm.js:393
addHandler bootstrap.esm.js:452
on bootstrap.esm.js:485
<anonymous> bootstrap.esm.js:2389
How do I get the import to resolve to the right Popper version? Manually changing the import in the node module solves the problem temporarily, but that will obviously not be a sustainable solution.
