使用babel轉碼器，讓瀏覽器支持es6語法

ECMAScript 6.0（如下簡稱 ES6）是 JavaScript 語言的下一代標準，但是不少瀏覽器並不支持es6語法，因此咱們須要一個轉碼工具，

把es6的語法轉換成瀏覽器支持的javascript，Babel是一個普遍使用的ES6轉碼器，能夠將ES6代碼轉爲ES5代碼。在babel的安裝設置裏我選用的是使用node

來進行安裝。

一、在你的項目下輸入命令：

npm install --save-dev babel-core

按回車健，運行以下：

2.配置文件.babelrc 

在項目根目錄下創建.babelrc 文件，由於個人是window系統，在更改文件名時會提示：

解決這個問題的辦法是把文件名更改爲".babelrc."。注意，先後都有".",。

配置.babelrc文件以下：

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

三、輸入轉換成es5規則的命令：

# ES2015轉碼規則
$ npm install --save-dev babel-preset-es2015

四、輸入react 語法規則命令(用不到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

而後將這些規則寫入 .babelrc文件：

 {
    "presets": [
      "es2015",
      "react",
      "stage-2"
    ],
    "plugins": []
  }

六、命令行轉碼babel-cli

 npm install --save-dev babel-cli

基本用法以下：

# 轉碼結果輸出到標準輸出
$ babel example.js

# 轉碼結果寫入一個文件
# --out-file 或 -o 參數指定輸出文件
$ babel example.js --out-file compiled.js
# 或者
$ babel example.js -o compiled.js

# 整個目錄轉碼
# --out-dir 或 -d 參數指定輸出目錄
$ babel src --out-dir lib
# 或者
$ babel src -d lib

# -s 參數生成source map文件
$ babel src -d lib -s

而後，改寫package.json。

{
  // ...
  "devDependencies": {
    "babel-cli": "^6.0.0"
  },
  "scripts": {
    "build": "babel src -d lib"
  },
}

轉碼的時候就可使用以下命令：

npm run build

參考文獻：http://es6.ruanyifeng.com/#docs/intro