一、簡介

1.ES6的某些高級(jí)語法在瀏覽器環(huán)境甚至是Node.js環(huán)境中無法執(zhí)行。
2.Babel是一個(gè)廣泛使用的轉(zhuǎn)碼器，可以將ES6代碼轉(zhuǎn)為ES5代碼，從而在現(xiàn)有環(huán)境執(zhí)行執(zhí)行。

創(chuàng)新互聯(lián)公司專注于江城企業(yè)網(wǎng)站建設(shè),響應(yīng)式網(wǎng)站設(shè)計(jì),商城網(wǎng)站開發(fā)。江城網(wǎng)站建設(shè)公司,為江城等地區(qū)提供建站服務(wù)。全流程按需網(wǎng)站建設(shè)，專業(yè)設(shè)計(jì)，全程項(xiàng)目跟蹤，創(chuàng)新互聯(lián)公司專業(yè)和態(tài)度為您提供的服務(wù)

二、安裝Babel

Babel提供babel-cli工具，用于命令行轉(zhuǎn)碼
安裝:npm i -g babel-cli
檢查安裝:babel --version

三、Babel的使用

1）安裝Node.js環(huán)境：https://nodejs.org/zh-cn/
2）進(jìn)入項(xiàng)目,初始化項(xiàng)目:npm init -y
3）創(chuàng)建文件 src/example.js
4）安裝轉(zhuǎn)碼器,在項(xiàng)目中安裝：npm i --save-dev babel-preset-env 或 npm i --save-dev babel-preset-es2015
5）創(chuàng)建文件并配置：.babelrc {"presets":["env","es2015"],"plugins":[]}
注：Babel的配置文件是.babelrc，存放在項(xiàng)目的根目錄下，該文件用來設(shè)置轉(zhuǎn)碼規(guī)則和插件。

四、文件轉(zhuǎn)化

1. 文件：
   babel src/index.js -o dist/index.js
   注：-o(--out-file)：輸出的意思
2. 文件夾：
   babel src -d dist
   注：-d(--out-dir)：指定輸入目錄
3. 實(shí)時(shí)監(jiān)控：
   babel src -w -d dist
   注：-w：watch監(jiān)控

五、自定義腳本

1）改寫package.json

{
  // ...
  "scripts":{
    // ...
    "build": "babel src\\index.js -o dist\\index.js"
  },
}

2）轉(zhuǎn)碼時(shí),執(zhí)行下面命令
mkdir dist
npm run build