ES Modules Demo

学习

浏览器要求：

  1. Safari 10.1.
  2. Chrome 61.
  3. Firefox 60.
  4. Edge 16.

使用方法：

index.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>
<script type="module">
    //type="module"是重中之重
    import { module1, module2 } from '/index.js'
    
    console.log(module1)
    console.log(module2)
</script>

</html>

index.js

1
2
3
4
5
6
7
import module1 from '/module1.js'
import module2 from '/module2.js'

export {
    module1,
    module2
}

module1.js

1
2
3
4
const module1 = {
    name: 'module1'
}
export default module1

module2.js

1
2
3
4
const module2 = {
    name: 'module2'
}
export default module2

得到