ES6模块的转码

ES6模块的转码

浏览器目前还不支持 ES6模块，为了现在就能使用，可以将转为 ES5 的写法。除了 Babel 可以用来转码之外，还有以下两个方法，也可以用来转码。

ES6 module transpiler

ES6 module transpiler是 square 公司开源的一个转码器，可以将 ES6模块转为 CommonJS模块或 AMD 模块的写法，从而在浏览器中使用。

首先，安装这个转码器。

1. $ npm install -g es6-module-transpiler

然后，使用compile-modules convert命令，将 ES6模块文件转码。

1. $ compile-modules convert file1.js file2.js

-o参数可以指定转码后的文件名。

1. $ compile-modules convert -o out.js file1.js

SystemJS

另一种解决方法是使用SystemJS。它是一个垫片库（polyfill），可以在浏览器内加载 ES6模块、AMD 模块和 CommonJS模块，将其转为 ES5 格式。它在后台调用的是 Google 的 Traceur 转码器。

使用时，先在网页内载入system.js文件。

1. src="system.js">

然后，使用System.import方法加载模块文件。

上面代码中的./app，指的是当前目录下的 app.js 文件。它可以是 ES6模块文件，System.import会自动将其转码。

需要注意的是，System.import使用异步加载，返回一个 Promise 对象，可以针对这个对象编程。下面是一个模块文件。

1. // app/es6-file.js:
3. export class q {
4. constructor() {
5. this.es6 = 'hello';
6. }
7. }

然后，在网页内加载这个模块文件。

上面代码中，System.import方法返回的是一个 Promise 对象，所以可以用then方法指定回调函数。