2

Scenario

As part of my prototyping process I wanted to bring in tween.js which I can do using a <script> tag on the html portion but I'd like to import this vanilla es5 file directly to my es6 files for various reasons.

What I'd like to do is something like

import * as TWEEN from 'import * as TWEEN from 'https://cdnjs.cloudflare.com/ajax/libs/tween.js/16.7.0/Tween.min.js'

While that seems to load the remote file I don't seem to get methods like TWEEN.Tween etc etc. I suspect all the es5 is disposed of in some sort of closure vacuum > garbage collection.

Question

I realize I can clone this file locally but I'm hoping to streamline my one-off style prototyping by importing cdn files that aren't always es6 friendly. Is this feasible ?

Jacksonkr
  • 31,583
  • 39
  • 180
  • 284
  • Does this answer your question? [How to import "old" ES5 code in ES6](https://stackoverflow.com/questions/36687661/how-to-import-old-es5-code-in-es6) – Parzh from Ukraine May 17 '21 at 19:17
  • Why don't you use the [npm package](https://www.npmjs.com/package/@tweenjs/tween.js) instead? `npm i -S @tweenjs/tween.js` , then `import TWEEN from '@tweenjs/tween.js';` and off you go – blex May 17 '21 at 19:18

1 Answers1

1

If you would like to inject Tween.min.js which is hosted on CDN via script tag, it will be UMD module, which is not compatible with ESM modules.

But, instead of importing it like you describe above, you can use/call it via window object:

window.TWEEN inside your esm modules.

When Tween.min.js will be loaded and executed it will be attached to window object.

Just to make sure that you are load that script first separately on HTML side, before your esm scripts/apps, otherwise window.TWEEN might be undefined.

Andrew Ymaz
  • 1,863
  • 8
  • 12
  • 1
    This was the "best" idea I could come up with, creating a non-attached script tag to load in the file separately. – Jacksonkr May 17 '21 at 19:39
  • 1
    yeah, so you can treat `Tween.min.js` as external library, which is not bundled into your esm app or script. – Andrew Ymaz May 17 '21 at 19:41