如何在Chrome Devtools JS控制台中从“ http://bar.org/some-esm-module.js”中导入等等？

当我尝试使用从Chrome devtools / javascript控制台导入的ESM时，它抱怨：

> import Confetti from 'https://cdn.skypack.dev/canvas-confetti'

Uncaught SyntaxError: Cannot use import statement outside a module

有什么办法说服chrome控制台以type='module'的身份执行，以便我可以使用模块语句？还是另一种解决方法，该方法仍然允许交互式导入ESM模块以进行交互式开发？

我一直在大量使用ESM模块，尤其是Skypack 自动转换的NPM ESM模块的大型库。这在静态开发中效果很好，但我是REPL /浏览器devtools的重度用户。

即使找到我可以用来加载ESM模块的第三方fakeImport(urlToESM)函数，对我来说也将大大提高生产力。

动态导入可能会派上用场。

import('/modules/my-module.js')
  .then((module) => {
    // Do something with the module.
});

您可以将其与await一起使用。

let module = await import('/modules/my-module.js');

Dynamic import()和顶级await应该可以工作：

const { default: Confetti } = await import('https://cdn.skypack.dev/canvas-confetti');

相关问答