读书笔记 《Babel》

作为一门依据专业制定,浏览器厂商各自落成的程序语言,从新语法的建议到标准,供给阅历短期的经过,贝布el
的股票总值就在于能够在新语法出现以前,尝鲜各类新语法,而不用担心浏览器包容的题材,所以把
Babel 称为「编写翻译」是卓殊适宜的

对于1门与时俱进的语言而言,那样的「编写翻译」机制是那些关键的,才有了各式各种立异的空子存在,CoffeeScript、TypeScript
都以在这么的地方下发生和发展兴起的

Babel Presets

Babel 由许许多多的插件构成,然后分化的插件组合到壹起成为一个Preset,官方协理的 Presets 有:

env: 本人运营的底子插件包
es20一伍: es20一五 协理插件包
es201陆: es201六 协理插件包
es20一柒: es20一七 支持插件包
latest: es20一5+es201陆+es201七支撑的插件包
react: react 辅助的插件包
flow: flow 帮助的插件包(协助变量类型检测)

在 github 上能够查找到近千个用户自定义出来的 babel
插件包:https://www.npmjs.com/search?q=babel-preset

其余官方还提供对张静在标准化进程中的JS语法方面包车型地铁插件包,他们之中自个儿是前进保持注重关系的,能够经过
npm view babel-preset-stage-0 类似的命令查看到:

Stage 0: 草案阶段
Stage 壹: 提出阶段
Stage 二: 起草阶段
Stage 3: 候选阶段
Stage 四: 达成阶段

Babel Polyfill

Babel 默许只转换新的 JavaScript 句法(syntax),而不更换新的 API ,比如
Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise
等全局对象,以及部分定义在全局对象上的形式(比如
Object.assign)都不会转码。

要使用那一个新的接口,就要调用 babel-polyfill 插件:

npm install babel-polyfill

程序中:

import "babel-polyfill"

Webpack中:

module.exports = {
  entry: ['babel-polyfill', './app/js']
}

Babel Babili

Babel 官方还友善做了贰个叫做 babili 的 JS 压缩工具:
https://github.com/babel/babili

Babel 的使用

Babel 的施用供给正视 .babelrc 恐怕 package.json
文件,官方文档有详实的介绍:
https://babeljs.io/docs/usage/babelrc/