Popper, Bootstrap 4 and ES2015: Popper not defined

Question

I am pretty confused on how to make the Javascript utilities in Bootstrap 4 work.

I am using ES2015 style requires. I've installed jQuery, the latest beta of Bootstrap 4 (beta 2) and Popper.js using node modules. Here's how I am loading my JS:

window.$ = window.jQuery = require('jquery');

$(function() {

  require('popper');
  require('./vendor/bootstrap/index');

});

Popper's docs state that you need code like this to instantiate Popper:

  var reference = document.querySelector('#dropdownLanguageButton');
  var popper = document.querySelector('div[aria-labelledby="dropdownLanguageButton"]');
  var anotherPopper = new Popper(
      reference,
      popper,
      {
          // popper options here
      }
  );

However, it is not clear if you need to instantiate for something as simple as a Bootstrap dropdown.

There is no clear example in the Bootstrap 4 docs.

The error I am getting is index.js:10 Uncaught ReferenceError: Popper is not defined.

Help appreciated!

That doesn't look like ES2015 imports thought, that looks like Commonjs. — elclanrs, Nov 19 '17 at 18:59

makenti · Answer 1 · 2017-12-08T15:33:29.180

-1

Maybe problem in path to popper.js. Popper's required file located in 'node_modules/popper.js/dist/umd/popper.min.js'

edited Dec 08 '17 at 15:33

answered Dec 08 '17 at 06:33

makenti

1
1

Popper, Bootstrap 4 and ES2015: Popper not defined

1 Answers1