es6转换工具之babel

es6虽然写起来简单，但是目前低版本浏览器无法兼容，因此需要转换成es5的语法。这里介绍一个babel。

首先安装,我用的npm安装

首先npm init -y                    ---------------初始化项目，生成一个本地package文件

?

1 2 3 4 5 6 7 8 9 10 11 12

{   "name": "es6Learn",   "version": "1.0.0",   "main": "index.js",   "scripts": {     "test": "echo \"Error: no test specified\" && exit 1"   },   "keywords": [],   "author": "",   "license": "ISC",   "description": "" }

　　

npm install -g babel-cli          ------------全局安装babel-cli 工具

 

安装完成后

npm install --save-dev babel-preset-es2015 babel-cli ----------------------本地安装babel-preset-es2015 和 babel-cli

 

安装完成后，我们可以看一下我们的package.json文件，已经多了devDependencies选项。

?

1 2 3 4

"devDependencies": {     "babel-cli": "^6.24.1",     "babel-preset-es2015": "^6.24.1"   }

新建.babelrc

在根目录下新建.babelrc文件，并打开录入下面的代码

?

1 2 3 4 5 6

{     "presets":[         "es2015"     ],     "plugins":[] }

假设  我们src文件夹下面的index文件装的是我们es6的语法，dist文件夹下面的index文件装的是我们es6转换成es5的语法，我们用babel转换一下 o表示输出到

 babel src/index.js -o dist/index.js

完成