我需要从内存变量导入 JavaScript 模块。
我知道这可以使用SystemJS and Webpack.
但我找不到一个好的工作示例或文档。文档主要讨论 .js 文件的动态导入。
基本上我需要像下面这样导入模块
let moduleData = "export function doSomething(string) { return string + '-done'; };"
//Need code to import that moduleData into memory
如果有人能指出文档那就太好了
存在一些限制import语法使得如果不使用外部库就很难做到这一点（如果不是不可能的话）。
我能得到的最接近的是使用动态导入 https://v8.dev/features/dynamic-import句法。下面是两个示例：第一个是我编写的原始版本，第二个是想要对其进行现代化改造的用户的编辑。
原来的：
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<script>
var moduleData = "export function hello() { alert('hello'); };";
var b64moduleData = "data:text/javascript;base64," + btoa(moduleData);
</script>
<script type="module">
async function doimport() {
const module = await import(b64moduleData);
module.hello();
}
doimport();
</script>
</body>
</html>
现代化的：
function doimport (str) {
if (globalThis.URL.createObjectURL) {
const blob = new Blob([str], { type: 'text/javascript' })
const url = URL.createObjectURL(blob)
const module = import(url)
URL.revokeObjectURL(url) // GC objectURLs
return module
}
const url = "data:text/javascript;base64," + btoa(moduleData)
return import(url)
}
var moduleData = "export function hello() { console.log('hello') }"
var blob = new Blob(["export function hello() { console.log('world') }"])
doimport(moduleData).then(mod => mod.hello())
// Works with ArrayBuffers, TypedArrays, DataViews, Blob/Files
// and strings too, that If URL.createObjectURL is supported.
doimport(blob).then(mod => mod.hello())
然而，您会注意到，这对构建导入代码的方式有一些限制，这可能与您的需要不完全匹配。
最简单的解决方案可能是将模块的代码发送到服务器上，以使其生成临时脚本，然后使用更常规的语法导入。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
