要使用Babel， 我们需要nodeJS的环境和npm， 主要安装了nodeJS， npm就默认安装了 ， 现在安装nodeJS很简单了， 直接下载安装就好了；文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
安装es-checker文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
在使用Babel之前 ， 我们要先检测一下当前node对es6的支持情况， 我们使用先es-checker， 命令行下执行：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
运行下面代码文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
1 | npm -g install es-checker |
es-checker安装完毕以后， 命令行执行：es-checker ， 如下图， 我的node环境版本是v4.4.3， 支持64%哦 ：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
babel的安装文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
所以我们来安装babel吧， 有了babel， 能够使用更多高级词法！文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
首先新建一个工作目录， 然后创建一个package.json的文件， 内部内容为：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
运行下面代码文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
1 2 3 4 5 6 | { "name": "my-project", "version": "1.0.0", "devDependencies": { }} |
然后再打开cmd(命令行), 在工作目录下执行命令安装babel-cli：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
运行下面代码文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
1 | npm --save-dev install babel-cli |
再安装一个全局的babel-cli：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
运行下面代码文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
1 | npm -g install babel-cli |
接着在工作目录创建一个名字为.babelrc的文件， 文件内容入如下（ 要注意window系统下创建这种文件系统会提示你：“必须键入文件名” ， 你可以找别的方式去创建， 我是在开发工具的工程目录中把这个文件创建出来的）：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
运行下面代码文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
1 2 3 4 5 6 | { "presets": [ "es2015" ], "plugins": []} |
安装babel-preset-es2015文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
还是工作目录， 然后再安装babel-preset-es2015：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
运行下面代码文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
1 | npm install --save-dev babel-preset-es2015 |
到目前为止babel算是安装完毕了：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
测试es6代码文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
创建一个test.js的文件， 8键入内容：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
运行下面代码文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
1 2 | let [a,b,c] = [1,2,3];console.log(a,b,c); |
在当前目录下执行：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
运行下面代码文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
1 | babel-node test |
结果应该是这样的：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html
如果直接用执行node test， 我这边会报异常： SyntaxError: Unexpected token文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/8473.html