es6探索之旅

ES6环境搭建

2017-03-09  本文已影响0人  meiziLin

ES6其实就是javascript的升级版。有些浏览器已经慢慢支持ES6,或者在node的环境下也可以支持ES6,但支持都只是大部分支持。在最终代码上线的时候我们还是要把项目代码转成ES5比较靠谱。而环境的搭建是第一步,在接下来的学习过程中,我会把所有的坑记录下来。

第一步:node.js的安装。下载请到http://nodejs.cn/下载对应的版本。windows下载.msi文件到桌面进行安装。安装完成后在命令行中输入nodev -v查询是否安装成功。

第二步:安装常用的模块,例如express(npm install -g express)。

第三步 :安装es检查器,命令行输入 npm install es-checker,然后再输入es-checker查看当前node版本对es6的支持程度。

第四步:创建 .babelrc文件,这个文件要在linux下面才可以创建的。因此,可以通过git bash进入到项目的文件目录下,输入touch .babelrc创建即可。

第五步:使用windows命令行安装转码规则:

# ES2015转码规则:

$ npm install--save-dev babel-preset-es2015

# react转码规则:

$ npm install--save-dev babel-preset-react

# ES7不同阶段语法提案的转码规则(共有4个阶段),选装一个:

$ npm install--save-dev babel-preset-stage-0

$ npm install--save-dev babel-preset-stage-1

$ npm install--save-dev babel-preset-stage-2

$ npm install--save-dev babel-preset-stage-3

将{"presets":["es2015","react","stage-2"],"plugins":[]}加入到.babelrc文件中

第六步:$ npm install--global babel-cli安装命令行转码。主要作用就是通过命令行控制代码进行转码。

第七步:创建test.js,内容为:

input.map(item => item + 1);

第八步:命令行输入babel test.js --out-file test1.js

查看test1.js内容如同以下则已经完成转码环境的配置。

"use strict";

input.map(function (item) {

return item + 1;

});

本文是参考http://es6.ruanyifeng.com/#docs/intro进行环境配置后的总结

上一篇下一篇

猜你喜欢

热点阅读