shepherd: ES2015 imports not working

Hi, first of all thank you for maintaining this module. I am trying to upgrade from tether-shepard and lots of things have changed.

I have tried both with 2-beta.14 and 2-beta.15 and get two different errors depending on the version.

in 2-beta.14 i get an error TypeError: __WEBPACK_IMPORTED_MODULE_1_shepherd_js___default.a.Tour is not a constructor importing it like this:

import Shepherd from 'shepherd.js';
import Popper from 'popper.js';
window.Popper = Popper;
window.Shepherd = Shepherd;

export function initTour() {
  return new Shepherd.Tour({
    defaults: {
      classes: 'shepherd-theme-default',
      scrollTo: true,
      showCancelLink: true,
    },
  });
}

in 2-beta.15 i get the error: TypeError: Popper is not a constructor

In node_modules/shepherd.js/dist/js/shepherd.js:430 at this.popper = new Popper(opts.element, this.el, popperOpts);

Any idea on what I am missing? Does Shepherd work when it is used within an es6 module?

Some advice would be greatly appreciated!

About this issue

Original URL
State: closed
Created 6 years ago
Reactions: 1
Comments: 27 (13 by maintainers)

Most upvoted comments

I just tried beta 16 and it works for me.

The other caveat is to also do an import of the css theme file that you want: import "shepherd.js/dist/css/shepherd-theme-dark.css";

elfenheart on Aug 15, 2018

@janusch I published beta 16 earlier. Does it work for you?

RobbieTheWagner on Aug 14, 2018

@rwwagner90 I think with the latest fixes from 7 days ago make it actually work.

Changes   —   f13736fc ⟷ e71cf03b
-  
+  export default Shepherd;

That way it is possible to: import Shepherd from 'shepherd.js/src/js/shepherd'; import Popper from 'popper.js'; window.Popper = Popper;

One will need Popper on window again though. For me that would be a solution that would work for now. Would you mind releasing another beta version to npm with the fix that is already in master?

janusch on Aug 14, 2018