浏览器内 es module 使用问题

Question

现代浏览器都已经支持了 ES Module, 为何加载模块会出现这样的问题？

浏览器运行下面的代码（方便分析，去除了其他无关标签）。

<script type="module">
  import * as d3 from "./d3/d3.js";
  // 1.Module类型对象 , d3.select() 为 undefined
  console.dir(d3);
</script>
<script>
  window.onload = function() {
    // 2.正常可以调用 d3
    console.log("onload: ", d3);
  };
</script>

为何在第一处会显示为 Module？模块未加载完？

如何解决？

可以在第一处就直接就可以调用 d3 的方法？

Answer 1

楼主你检查一下是不是d3的问题？或者浏览器版本。
我是这样写的：

<script type="module">  
    // import {func} from './modules/a.js';  
    // console.log(func());  
    import * as test from './modules/a.js';  
    console.dir(test);  
    console.log(test.func());  
    window.test = test;  
</script>

a文件内容：

export const func = function () {  
  return 'abc';  
};

这是结果：