JS語法轉換-ES6轉ES5

1.使用Babel轉碼

　　全局安裝

npm install -g babel-cli

　　布局安裝

npm install -g babel-cli --save-dev

　　

Babel的配置文件是.babelrc，存放在項目的根目錄下。使用Babel的第一步，需要配置這個文件。

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

點擊此處到Babel中文官網presets配置頁面：Babel Plugins

# 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"
    ],
    "plugins": []
  }

　　然后在命令行開始轉es5

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

# 整個目錄轉碼
# --out-dir 或 -d 參數指定輸出目錄
$ babel src --out-dir lib
# 或者
$ babel src -d lib
 
# -s 參數生成source map文件
$ babel src -d lib -s

2.gulp

　　安裝gulp

npm install gulp --save-dev

　　安裝gulp的轉碼工具 babel

npm install --save-dev gulp-babel

　　安裝完成后 會發現package.json中

{
  "devDependencies": {
    "babel-cli": "^6.22.2",
    "gulp": "^3.9.1",
    "gulp-babel": "^6.1.2"
  }
}

　　編寫gulpfile.js文件，設置任務 轉碼

var gulp = require("gulp");
var babel = require("gulp-babel");
 
gulp.task("default", function () {
  return gulp.src("src/a.js")
    .pipe(babel())
    .pipe(gulp.dest("lib"));
});

　　在命令行輸入，src文件夾中的a.js已經被轉碼成ES5標准的a.js。（在了lib文件夾）

gulp

　　

　還有一個鏈接介紹es5的功能的

　參考鏈接