babel 7 从入门到精通

本文以babel 7做为蓝本进行介绍。

它是：

一个由"各种语言->ES5"的转译器

工作模式：

AOT(预先转译)和JIT（即时转译）

工作原理：

借助于presets和plugins的语言转译，由于presets和plugings的无限种可能变化，导致其能力非凡！

借助于CLI的AOT方式：

安装

npm install --save-dev @babel/core @babel/cli @babel/preset-env
npm install --save @babel/polyfill

{project}/babel.config.js:

const presets = [
  [
    "@babel/env",
    {
      targets: {
        edge: "17",
        firefox: "60",
        chrome: "67",
        safari: "11.1",
      },
      useBuiltIns: "usage",
    },
  ],
];
module.exports = { presets };

将 src 目录下的所有代码编译到 lib 目录：

npx babel src --out-dir lib
或
npx babel src -o lib

配置的不同形式如下（都在项目的根下）：

1. babel.config.js
2. .babelrc
3. package.json中的babel属性
4. .babelrc.js
5. 使用cli 参数：
   babel --plugins @babel/plugin-transform-arrow-functions script.js

参考文献：
babel中文官网

@babel/preset-env 官网

2016的阮一峰博客