本文摘自阮一峰老師的《ECMAScript 6入門(mén)》，原文地址：http://es6.ruanyifeng.com/#docs/intro

?

ECMAScript 6 是一個(gè)泛指，含義是5.1版本后的JavaScript的下一代標(biāo)準(zhǔn)，涵蓋了ES2015, ES2016, ES2017等。

Babel轉(zhuǎn)碼器是一個(gè)廣泛使用的ES6轉(zhuǎn)碼器，可以將ES6轉(zhuǎn)碼為ES5。

?

配置文件：.babelrc

配置文件基本格式：

// .babelrc
{“presets”: [],"plugins": [], }

使用babel先要安裝規(guī)則集，安裝完后加入到配置文件中。官方的規(guī)則集如下：

# ES2015轉(zhuǎn)碼規(guī)則 $ npm install --save-dev babel-preset-es2015 # react轉(zhuǎn)碼規(guī)則 $ npm install --save-dev babel-preset-react # ES7不同階段語(yǔ)法提案的轉(zhuǎn)碼規(guī)則（共有4個(gè)階段），選裝一個(gè) $ 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 // .babelrc
{"presets": ["es2015","react","stage-2"],"plugins": []}

?

babel-ci 模塊

babel-ci模塊是在命令行中使用babel, 使用babel命令可以直接對(duì)文件進(jìn)行轉(zhuǎn)碼，對(duì)于項(xiàng)目來(lái)說(shuō)，可以直接將其寫(xiě)在package.json中，然后將命令放在scripts 中。

安裝命令如下：

$ npm install --global-cli

?

基本用法如下：

# 轉(zhuǎn)碼結(jié)果輸出到標(biāo)準(zhǔn)輸出 $ babel example.js# 轉(zhuǎn)碼結(jié)果寫(xiě)入一個(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

在項(xiàng)目中裝載和使用babel-cli:

# 安裝 $ npm install --save-dev babel-cli // package.json {// ..."devDependencies": {"babel-cli": "^6.0.0"},"scripts": {"build": "babel src -d lib"}, }

?

babel-register 模塊

babel-register模塊改寫(xiě)require命令，為它加上一個(gè)鉤子，此后，每當(dāng)使用require加載.js, .jsx, 和.es6后綴名的文件，就會(huì)先用Babel進(jìn)行轉(zhuǎn)碼：

$ npm install --save-dev babel-register require("babel-register"); require("./index.js");

注意： babel-register只會(huì)對(duì)require命令加載的文件轉(zhuǎn)碼，而不會(huì)對(duì)當(dāng)前文件轉(zhuǎn)碼。

?

Babel可以用于瀏覽器環(huán)境，不過(guò)從6.0版本開(kāi)始，不再直接提供瀏覽器版本，而是要用構(gòu)建工具構(gòu)建出來(lái)。

babel 和browserify 配合使用：

{ "browserify": { "transform": [["babelify", { "presets": ["es2015"] }]] } }

?

轉(zhuǎn)載于:https://www.cnblogs.com/JacobQiao/p/6200811.html

總結(jié)

以上是生活随笔為你收集整理的JavaScript 学习笔记-- ES6学习（一）介绍以及Babel的使用的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。