Estoy creando un sistema dinámico que necesita ejecutar el código JS que se genera sobre la marcha en una aplicación de navegador (Edge o Chrome más reciente). De otro ejemplo que he llegado hasta aquí:
async function doIt() { let code = ""; code += "import { MyClass } from './MyClass.js' ;\n"; code += 'export default function hello() { console.log( "Hello World" ); console.log( MyClass.test() ); }'; const dataUri = 'data:text/javascript;charset=utf-8,' + encodeURIComponent(code); let module = await import(dataUri); console.log(module); // property default contains function hello now const myHello = module.default; myHello(); // puts "Hello World" to console }Donde MyClass.js tiene una clase de módulo ES6 trivial:
export class MyClass { static test() { return 42; } }Cuando ejecuto la función doIt() sin la segunda línea con la declaración de importación, funciona bien hasta que intenta llamar a MyClass.test(), que entonces se desconoce, por supuesto. Con la segunda línea de importación habilitada, da el error en Edge o Chrome:
"Uncaught TypeError: Failed to resolve module specifier './MyClass.js'. Invalid relative url or base scheme isn't hierarchical."Intenté hacer una ruta absoluta de la referencia del módulo, pero el error sigue siendo el mismo. . Entonces, ¿cómo hacer que esto funcione? ¿O tal vez una solución alternativa? Pero usar módulos ES6 es un requisito difícil.
Para responder a mi propia pregunta: import() parece estar algo paralizado, pero una solución es colocar el JavaScript dinámico deseado en el HTML interno de un nuevo nodo de secuencia de comandos temporal en la página HTML actual. A partir de ahí, las instrucciones de importación de ES6 se ejecutan perfectamente:
var script = document.createElement( "script" ); script.setAttribute( 'type', 'module' ); script.innerHTML = 'import { MyClass } from "/App/MyClass.js"; \ someGlobalVar = MyClass.test();Dado que se ejecuta en el ámbito global, debe almacenar los resultados en algún objeto global. Podría refinarse implementando una función de devolución de llamada en una instancia de objeto, pero lo dejo como ejercicio para el lector. :-)