es和babel轉換器

es6轉換成es5，轉換器 babel

 

 

1.若是webApp文件夾下沒有package.json文件，能夠手動創建一個package.json文件

 

{

  "name": "babel-test",

  "version": "",

  "description": "",

  "repository": {

    "url": ""

  },

  "scripts": {},

  "author": "",

  "license": "",

  "devDependencies": {

    

  },

  "dependencies": {}

}

 

也可使用命令創建package.json文件

1.cd C:\webApp 切換到某個文件夾下

2.npm init    會陸續提示輸入內容，最終生成package

 

2.安裝babel文件

npm install --save-dev babel

 

npm install --save-dev babel-cli

 

npm install babel-preset-env --save-dev

 

npm install --save-dev babel-preset-es2015

npm安裝package.json時  直接轉到當前項目目錄下用命令npm install 或npm install --save-dev安裝便可，自動將package.json中的模塊安裝到node-modules文件夾下

3.建立.babelrc配置文件

{

"presets": ["env","es2015"]

}

 

4.運行

npx babel a.js

 

 

a.js文件：

 

'use strict'

console.log('1111');

console.log('2222');

var array=[1,2,3,4];

var a=array.filter(x=>x>2);

console.log(a);

 

編譯輸出：

 

npx babel a.js --out-file b.js

 

babel編譯後的文件：（已經將filter方法，轉成es2015）

 

 

 

 

 

 

【traceur】

npm install -g traceur 

 

trcaeur  --script calc.es6.js --out calc.es5.js