javascript - 如何导入已在 <script type ="module"> 标签中定义的 es6 模块 inside html?

标签 javascript html es6-modules

我可以在我的 html 文件 me.html 中定义一个模块:

<script type="module" id="DEFAULT_MODULE">   
           import Atom from './atom.js';       
           console.log("definition of getAtom")
           export default function getAtom(){
            return new Atom('atom');
           }
           console.log("exported getAtom")
</script>

另见

=> 是否可以将该“匿名”模块导入同一 html 文件中的另一个模块脚本?还是某些“代码隐藏”- 也已由 me.html 文件加载的 JavaScript 文件?导出似乎有效;至少它不会抛出任何错误。

对于 getAtom 方法的导入,我试过例如:

<script type="module">
    import getAtom from '.'; //this line does not work
    console.log("usage of getAtom")
    var atom = getAtom();             
</script>

我希望有一些像

这样的语法
 import getAtom;
 import getAtom from '.';
 import getAtom from window;
 import getAtom from './me.html';
 import getAtom from '.DEFAULT_MODULE';

但是,这些行都不起作用。

=>如果可能的话,引用“匿名”模块的正确语法是什么?

我使用的是 Chrome 版本 63.0.3239.108。

相关问题:

How to dynamically execute/eval JavaScript code that contains an ES6 module / requires some dependencies?

最佳答案

据我所知,没有办法导入“匿名”模块,因为“匿名”模块没有模块说明符或单独的 url(它的 import.meta.url 只是 html url 作为当前规范)。理论上它可以在未来扩展,但我找不到这种功能的好的用例。

关于javascript - 如何导入已在 &lt;script type ="module"> 标签中定义的 es6 模块 inside html?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47982205/

相关文章:

javascript - 从 ng-grid 访问 header 值

javascript - 使用 JavaScript ES6 模块进行离线首次设计

php - 自动刷新 div 内容并立即向下滚动?

javascript - 显示模态时隐藏下拉菜单

javascript - 使用 jquery 查找 html 标签号

html - 如何阻止表格数据破坏我的布局?

javascript - CustomElements V1 和 ShadowDOM 的外部样式

html - Bootstrap 卡/卡列破坏

javascript - 导入/更改 HTML 内容(ES6 更新后)

javascript - 如何正确地将 ES6 模块函数导出为库以在 Node 应用程序中使用?