# ES6模塊化使用
## 定義package.json文件
```
{
"name" : "es6-babel-browserify",
"version" : "1.0.0"
}
```
## 目錄結構
```
|-js
|-|-src
|-|-|-module1.js
|-|-|-module2.js
|-|-|-module3.js
```
## 編碼
### js/src/module1.js
```
export function foo() {
console.log('module1 foo()');
}
export let bar = function () {
console.log('module1 bar()');
}
export const DATA_ARR = [1, 3, 5, 1]
```
### js/src/module2.js
```
let data = 'module2 data'
function fun1() {
console.log('module2 fun1() ' + data);
}
function fun2() {
console.log('module2 fun2() ' + data);
}
export {fun1, fun2}
```
### js/src/module3.js
```
export default {
name: 'Tom',
setName: function (name) {
this.name = name
}
}
```
### js/src/app.js
```
import {foo, bar} from './module1'
import {DATA_ARR} from './module1'
import {fun1, fun2} from './module2'
import person from './module3'
foo()
bar()
console.log(DATA_ARR);
fun1()
fun2()
person.setName('JACK')
console.log(person.name);
```
## node使用
`node js/src/app.js`
## 瀏覽器使用
```
<script src="js/src/app.js" type="module"></script>
```
##
