es6轉換工具之babel

es6雖然寫起來簡單，但是目前低版本瀏覽器無法兼容，因此需要轉換成es5的語法。這里介紹一個babel。

首先安裝,我用的npm安裝

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

{
  "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選項。

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

新建.babelrc

在根目錄下新建.babelrc文件，並打開錄入下面的代碼

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

假設  我們src文件夾下面的index文件裝的是我們es6的語法，dist文件夾下面的index文件裝的是我們es6轉換成es5的語法，我們用babel轉換一下 o表示輸出到

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

完成