安裝node環(huán)境
地址：https://nodejs.org/en/download/
建立項(xiàng)目目錄
建立一個(gè)項(xiàng)目目錄es6-demo，并在目錄下建立兩個(gè)子文件夾src和dist柏腻；
- src：源代碼es6的目錄
- dist：編譯后es6的目錄
初始化項(xiàng)目
使用下面命令初始化項(xiàng)目旨巷，在項(xiàng)目目錄下生成package.json文件：
npm init
//或者
npm init -y
兩者區(qū)別在于宵距，前者是分步確認(rèn)生成的信息，后者是默認(rèn)確認(rèn)生成的信息；
全局安裝babel-cli
Babel 是一個(gè)廣泛使用的 ES6 轉(zhuǎn)碼器卒煞，可以將 ES6 代碼轉(zhuǎn)為 ES5 代碼偏螺，從而在現(xiàn)有環(huán)境執(zhí)行行疏；Babel提供了babel-cli工具，用于命令行轉(zhuǎn)碼套像；
npm install babel-cli -g
基本用法：
# 轉(zhuǎn)碼結(jié)果輸出到標(biāo)準(zhǔn)輸出
$ babel example.js
# 轉(zhuǎn)碼結(jié)果寫入一個(gè)文件
# --out-file 或 -o 參數(shù)指定輸出文件
$ babel example.js --out-file compiled.js
# 或者
$ babel example.js -o compiled.js
# 整個(gè)目錄轉(zhuǎn)碼
# --out-dir 或 -d 參數(shù)指定輸出目錄
$ babel src --out-dir lib
# 或者
$ babel src -d lib
# -s 參數(shù)生成source map文件
$ babel src -d lib -s
建立.babelrc
在項(xiàng)目根目錄下酿联，創(chuàng)建.babelrc，.babelrc是Babel的配置文件；該文件是用來設(shè)置轉(zhuǎn)碼規(guī)則和插件的贞让，基本格式如下：
{
"presets":[],//轉(zhuǎn)碼規(guī)則
"plugins":[]// 轉(zhuǎn)碼插件
}
安裝轉(zhuǎn)碼規(guī)則
在本地安裝轉(zhuǎn)碼規(guī)則模塊babel-preset-es2015:
npm install --save-dev babel-preset-es2015
然后周崭，將規(guī)則加入.babelrc文件當(dāng)中：
{
"presets":[
"es2015"
],
"plugins":[]
}
編譯基本代碼
在項(xiàng)目根目錄下建立index.html文件
/index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>hello es6</title>
<script src="./dist/index.js"></script>
</head>
<body>
Hello es6
</body>
</html>
引入js文件，是編譯后的js文件喳张，即dist目錄下的文件续镇；
在src文件下創(chuàng)建即將要編寫的index.js文件
/src/index.js
let a = 1;
let b = 1;
console.log(a + b);
這里用的let是es6的一種聲明方式，接下來我們需要把這個(gè)ES6的語法文件自動(dòng)編程成ES5的語法文件销部。
首先摸航，我們使用babel命令行來編譯：
babel src/index.js -o dist/index.js
這樣就可以，看見在dist目錄下生成一個(gè)index.js文件：
"use strict";
var a = 1;
var b = 1;
console.log(a + b);
編譯成功舅桩。
使用babel命令行酱虎，一大長串，很容易忘記什么擂涛，所以读串，我們可以改造package.json，來使用更容易記住的命令來編譯:
"scripts": {
"build": "babel src/index.js -o dist/index.js"
}
在"scripts"模塊下撒妈，添加上面的命令行恢暖，然后使用命令：
npm run build
就可以直接編譯了；
參考：
- 阮一峰的es6入門http://es6.ruanyifeng.com
