1.7 Traceur转码器

Google公司的Traceur转码器（github.com/google/traceur-compiler），也可以将ES6代码转为ES5代码。

1.7.1 直接插入网页

首先，必须在网页头部加载Traceur库文件。

以上代码中一共有4个script标签。第一个用于加载Traceur的库文件，第二个和第三个将这个库文件用于浏览器环境，第四个则用于加载用户脚本，这个脚本中可以使用ES6代码。

注意！

第四个 script 标签的 type 属性值为 module，而不是 text/javascript。这是Traceur编译器识别ES6代码的标志，编译器会自动将所有type=module的代码编译为ES5，然后再交给浏览器执行。

除了引用外部ES6脚本，也可以直接在网页中放置ES6代码。

正常情况下，执行以上代码会在控制台打印出9。

如果想对Traceur的行为进行精确控制，可以采用以下的参数配置写法。

以上代码首先生成 Traceur 的全局对象 window.System，然后可以用 System.import方法来加载ES6。加载时需要传入一个配置对象metadata，该对象的traceurOptions属性经配置可以支持ES6功能。如果设为experimental：true，就表示除ES6以外还支持一些实验性的新功能。

1.7.2 在线转换

Traceur也提供了一个在线编译器，可以在线将ES6 代码转为ES5代码。转换后的代码可以直接作为ES5代码插入网页运行。

将上面的例子转为ES5代码运行，结果如下。

1.7.3 命令行转换

作为命令行工具使用时，Traceur是一个Node模块，需要先用Npm安装。

安装成功即可在命令行下使用。

Traceur直接运行ES6脚本文件，会在标准输出中显示运行结果（以前面的calc.js为例）。

如果要将ES6脚本转为ES5代码保存，可采用下面的写法。

其中的--script选项表示指定输入文件，--out选项表示指定输出文件。

为了防止有些特性编译不成功，最好加上--experimental选项。

转换得到的文件就可以放到浏览器中运行了。

1.7.4 Node环境的用法

Traceur的Node用法如下（假定已安装traceur模块）。