export {generateRandom as random, sum as doSum} 下面我們再來看看如何在其他的模組中是喲了那個這些匯出的值. app.js

import { generateRandom, sum } from'utility';
 
console.log(generateRandom());//logs a random number
console.log(sum(1, 2));//3

注意第一行. 它將從utility模組中匯入值. 當然, 如果你只想匯出一個值(例如sum), 你可以使用下面的方式:

1	import { sum } from'utility' ;

同樣, 你也可以將整個模組當作一個物件匯入, 然後引用的時候, 使用物件屬性的方法. 所以我們可以使用下面的方式:

import 'utility' as utils;
 
console.log(utils.generateRandom());//logs a random number
console.log(utils.sum(1, 2));//3

很簡單是不是? 這其實就是ES6的"命名匯入". 接下來, 我們來看看如何使用預設匯出. "預設匯出"和"重匯出"(Default Exports and Re-exporting) 如果你只想從一個模組中匯出一個值, 可以使用預設匯出. 為了演示預設匯出的用法, 我們需要修改utility.js utility.js

var utils = {
  generateRandom:function() {
    return Math.random();   
  },
  sum:function(a, b) {
    return a + b;
  }
};
 
export default utils;
 

最後一行將utils 這個變數進行匯出. 而在另外一個模組中, 引用方法如下: app.js

import utils from'utility';
 
console.log(utils.generateRandom());//logs a random number
console.log(utils.sum(1, 2));//3
export default utils; //exports the imported value

第一行程式碼首先將utils物件進行匯入, 你也可以同樣可以將其重新匯出.如最後一行. 以上這些就是ES6 Modules 的大致介紹. 接下來,我們來看一下如何將ES6的模組轉變為ES5, 並且可以執行並且測試. 使用ES6模組轉換器.(Using the ES6 Module Transpile) ES6模組轉換器是一個可以將你的ES6程式碼轉換成CommonJS 或者AMD 風格的ES5程式碼 你可以使用下面的命令進行安裝.

1	npm install -g es6-module-transpile

在轉換之前, 我們先來看看程式碼的結構. 原始碼可以去github上面下載

1 2 3 4 5

es6-modules scripts/ app.js utility.js out/

scripts 資料夾是我們模組的程式碼, 我們將編譯這部分的程式碼並且放置到out目錄中. 進入es6-modules 目錄, 執行命令.
compile-modules convert -I scripts -o out app.js utility.js --format commonjs