0

So I'm writing an ES6 application that uses multiple files and dependencies. I bundle this up using webpack in to a single bundle.js. From here I want to run it through Babel to get ES5 JS inside of a VM (Duktape.) From here I can run the JS successfully, but then I want to actually instantiate the class I originally created by appending additional JS on to the end of this generated ES5 code.

Normally, my final output file built.js could be required like this:

const MyLib = require('built.js');

And then I would just use it like so:

let instance = MyLib();
instance.doSomething();

However, I need to access MyLib from the same JS string, instead of using require or import. The Babelfied output doesn't have meaningful names or any way to simply instantiate a "class" in vanilla JS. How would I use my module from ES5 appended to the end of this file?

Jameson
  • 968
  • 1
  • 11
  • 24
  • 1
    It's unclear what you mean by "vanilla js". Usually that refers to native dom manipulation without libraries, and has nothing to do with webpack or babel. – Bergi Sep 16 '19 at 20:42
  • 2
    Your use of terminology is very confusing: ES6 *is* vanilla js. Nor does require work in a browser, so that's happening...how? – Jared Smith Sep 16 '19 at 20:42
  • 2
    It sounds like you didn't use the right output type in your webpack configuration. How exactly do you want to load the bundle and your "single js file"? – Bergi Sep 16 '19 at 20:44
  • @JaredSmith I need to load it in to Duktape, which doesn't support ES6. When I say vanilla JS, I suppose I mean an outdated JS that doesn't support arrow function, the let keyword, etc. – Jameson Sep 16 '19 at 21:08
  • @Bergi I just mean ES5 I believe. I'm not interested in DOM manipulation, this is run from C using Duktape. – Jameson Sep 16 '19 at 21:09
  • @Bergi I want to load the single JS file in to Duktape as a string to evaluate, and then append to the end usage of my module. – Jameson Sep 16 '19 at 21:10
  • 2
    Why do you not just use ES6 imports of `MyLib`, and then have your "single js file" as the entry point to webpack, resulting in a single executable bundle? – Bergi Sep 16 '19 at 21:19
  • In any case, https://webpack.js.org/configuration/output/#outputlibrary – Bergi Sep 16 '19 at 21:22
  • @Bergi This helps. I can do this, but I think it actually gets at the root of my question: I put code through webpack and get uglified code back out. How do I reliably access the imported class? I can put it in global.MyLib, but the sandboxed environment of Duktape is going to wipe out global. – Jameson Sep 16 '19 at 21:23
  • @Jameson you should "access the imported class" in your pre-compiled code, then after compiling, just run the resulting uglified code... that is what everyone has been trying to tell you to do. – Patrick Roberts Sep 16 '19 at 21:26
  • 1
    @Bergi making the webpack output a library solves my problem. I wasn't aware of this option. Thanks for the help. – Jameson Sep 16 '19 at 21:30

0 Answers0