JavaScript using "import from" dynamically

[edwardsmarkf]

hello -

i have used the following syntax a number of times with much success:

        let script    = document.createElement('script')              ;
        script.src      = '/js/myJavaScript.js'                    ;
        script.type     = 'text/javascript'                         ;
        script.async    = false                                         ;
        const scripts   = document.getElementsByTagName('script')[0]    ;
        scripts.parentNode.insertBefore(script, scripts)                ;

however, i am unable to determine how to use this same approach to replace the following code:

import myName from '/js/myJavaScript.js' ;

is this even possible?

 

[edwardsmarkf]

hello -

i have used the following syntax a number of times with much success:

        let script    = document.createElement('script')              ;
        script.src      = '/js/myJavaScript.js'                    ;
        script.type     = 'text/javascript'                         ;
        script.async    = false                                         ;
        const scripts   = document.getElementsByTagName('script')[0]    ;
        scripts.parentNode.insertBefore(script, scripts)                ;

however, i am unable to determine how to use this same approach to replace the following code:

import myName from '/js/myJavaScript.js' ;

is this even possible?

Edit - adding this:

script.innerText =  "import myName from '/js/myJavaScript'";

gets me an identical value in: document.getElementsByTagName('script')[0] as the import myName from does, but sadly still does not work.

console.log(document.getElementsByTagName('script')[0]  )       ;
// result:  <script type="module">import myName from '/js/myJavaScript'</script>

 

[edwardsmarkf]

i figured it out:

var WaveSurfer = null;
let script        = document.createElement('script')        ;
script.type        = 'module'                ;
script.innerText    = "import ws from 'https://unpkg.com/wavesurfer.js@beta'; WaveSurfer=ws;";
document.head.appendChild(script);

the solution is to use a global variable - unless one of you wizards have a better solution...?