babel

babel-cli:

命令行转码:ng install -g babel-cli
基本用法:babel example.js

babel-node

babel-cli工具自带一个babel-node命令,支持node的REPL环境

$ babel-node
> (x => x * 2)(1)
2
babel-register

为require添加一个钩子,require加载.js,.jsx,.es,.es6文件,会先用Babel转码,实时转码,只适用于开发环境

babel-core

转化JavaScript代码

babel-polyfill

babel默认只转化新的js句法,不转化API,babel-polyfill支持比如Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise等全局对象,以及一些定义在全局对象上的方法(比如Object.assign)等转码。

babel-plugin-transform-runtime

提供编译模块需要服用的工具函数
(https://segmentfault.com/q/1010000005596587?from=singlemessage&isappinstalled=1)

babel插件、预设、基于环境配置Babel

plugins:配置插件

{ 
   "plugins": [ 
      ["transform-es2015-classes", { "loose": true }] 
    ] 
}

__ preset__
presets字段设定转码规则

babel-preset-es2015: es6转码规则

babel-preset-react: react转码规则

babel-preset-stage-x: JavaScript的一些提案,分为四个阶段

  • babel-preset-stage-0
  • babel-preset-stage-1
  • babel-preset-stage-2
  • babel-preset-stage-3

基于环境配置

  {
    "presets": ["es2015"],
    "plugins": [],
    "env": {
       "development": {
          "plugins": [...]
       },
       "production": {
         "plugins": [...]
       }
    }
  }

语法检查babel-eslint

.eslintrc文件并设置 parser为 babel-eslint

相关链接:
https://github.com/thejameskyle/babel-handbook/blob/master/translations/zh-Hans/user-handbook.md#toc-babel-preset-es2015

你可能感兴趣的:(babel)