浏览器环境下 ES6 的 export, import 的用法举例

有两个地方需要注意。一是 export 和 import 要配合使用，且模块内还可以再引入(import)次级模块。二是要把引入的对象（函数等）赋值给 window.varname，这样才能在 js 块内使用。原因是 module 块是隔离的，它能访问 js 块但 js 块不能访问 module 块。这里说的 module 块，是指处于 <script type="module"> </script> 标签内的代码块。而 js 块是指处于 <script type="text/javascript"></script>标签内的代码块。当然module块和js块都可以有多个（此时各module块及其与js块之间都是互相隔离的，而各 js块则像同一块）。
以下第一段代码是 index.html 的相关部分，这其中设置了一个标志来表示 module 加载是否就绪，因为整个 html 文件在加载时 module 块是稍后完成的。第二段是要引入的 js 模块文件。
1、index.html 部分代码

    <script type="module">
    import {func1, func2,} from "./tools.js"
    window.func1a = func1;
    window.func1b = func2;
    moduleOk = true;
    </script>
    <script type="text/javascript">
    let moduleOk = false;
    if(moduleOk ){
    let lca = func1a();
    let lcb = func1b();
    }
    </script>

2、 tools.js 代码

    export {func1, func2, };
    function func1(){};
    function func2(){};

ES6 的 export，import 指令，使得浏览器也能像 node.js 一样拥有很好的模块功能。