再看 Babel

前言

目前鲁班标配为 Babel 7+ 版本

官网地址 https://babeljs.io/docs/en/pl...

开发手册 https://github.com/jamiebuild...

功能

• 语法转译
• 转译特性到目标环境（@babel/polyfill）
• 源码转译

工作机制

原始代码 --> [Babel Plugin] --> 转换后的代码

可以简单的把Babel Preset视为Babel Plugin的集合

presets

官方提供的 presets

• @babel/preset-env
• @babel/preset-flow
• @babel/preset-react
• @babel/preset-typescript

简写

{
  "presets": [
    "env",
    "@babel/preset-env" // 相等
  ]
}

运行顺序

{
  "presets": [
    "a",
    "b",
    "c"
  ]
}

运行顺序为从后向前，如：c, b ,a

options 机制

{
  "presets": [
    ["@babel/preset-env", {
      "loose": true,
      "modules": false
    }]
  ]
}

plugins

运行顺序

{
  "plugins": [
    "a",
    "b",
    "c"
  ]
}

plugins 在 presets 之前运行，运行顺序为从前向后：a, b ,c

options 机制

{
  "plugins": ["pluginA", ["pluginA"], ["pluginA", {}]]
}

{
  "plugins": [
    [
      "transform-async-to-module-method",
      {
        "module": "bluebird",
        "method": "coroutine"
      }
    ]
  ]
}