4

I have a UMD library and the following works in commonjs...

global.window = global;
var DoSomething = require("../dist/sce-umd.js").DoSomething;
(function(){
    var instance = new DoSomething();
    instance.doSomethingElse();
})()

I am trying to do the same thing with ESM like...

(()=>{
    // Needed for UMD
    global.window = global;
    import("../dist/sce-umd.js").then((OtherThing)=>{

        console.log("This is the next level");
        const other = new OtherThing();
        other.doSomethingElse();
    });
})();

But I get...

TypeError: OtherThing is not a constructor

I also tried new OtherThing.DoSomething() but I get...

TypeError: OtherThing.DoSomething is not a constructor

Jackie
  • 21,969
  • 32
  • 147
  • 289
  • I'm guessing you need to write it like `import { default as OtherThing } from '../dist/sce-umd.js'` but not sure. Can you show how your UMD module exports itself? – yqlim Jun 25 '19 at 02:17
  • Did you ever find a solution? – jjmontes Mar 02 '21 at 18:08

1 Answers1

0

You must use the .default prop of the returned module, like so below:

import("./some-umd.js").then((myModule)=>{
    const myThing = myModule.default;  <---- This is the key 
    // ... do what you need with myThing
});

In normal import, you do the following if import { default as myThing } from './some-umd.js'; doesn't work:

import myModule from './some-umd.js';

const myThing = myModule.default;
Markuso
  • 9
  • 4