预设

Babel 预设可以作为 Babel 插件和配置选项的共享集。

官方预设

我们为常见环境组合了几个预设：

其它集成

如果你没有直接使用 Babel，那么你正在使用的框架可能有自己的配置供您使用或扩展。npm 上提供了许多其他社区维护的预设！

Next.js | Nuxt.js | Parcel | Jest | Gatsby

使用预设

在 Babel 配置中，如果预设在 npm 上，你可以传入预设的名称，Babel 将检查它是否已经安装在 node_modules 中。这将添加到预设配置选项中，该选项接受一个数组。

babel.config.json
{
  "presets": ["babel-preset-myPreset", "@babel/preset-env"]
}

除此以外，还可以指定预设的相对或绝对路径。

babel.config.json
{
  "presets": ["./myProject/myPreset"]
}

有关配置插件或预设路径的更多细节，请参见名称规范化。

Stage-X (实验性预设)

Deprecated

As of Babel 7, we've decided to deprecate the Stage-X presets and stop publishing them. Because these proposals are inherently subject to change, it seems better to ask users to specify individual proposals as plugins vs. a catch all preset that you would need to check up on anyway. Check out our blog for more context.

stage-x 预设中的任何转换都是对一部分未经批准作为 JavaScript 发行版的更改（例如 ES6 / ES2015）。

TC39 将提案分为以下几个阶段：

Stage 0 - 稻草人：只是一个想法，可能是 Babel 插件。
Stage 1 - 提案：这值得努力。
Stage 2 - 草案：初始规范。
Stage 3 - 候选：完整的规范和初始的浏览器实现。
Stage 4 - 完成：将被添加到下一个年度发行版中。

有关更多信息，请务必查阅当前的 TC39 提案及其流程文档。

Yehuda Katz (@wycatz) 在 thefeedbackloop.xyz 的几个帖子中也详细解释了 TC39 阶段的流程：Stage 0 and 1, Stage 2, Stage 3

创建预设

要制作你自己的预设（本地使用或 npm），您需要导出一个配置对象。

它可以返回一个插件数组..

JavaScript
module.exports = function() {
  return {
    plugins: ["pluginA", "pluginB", "pluginC"],
  };
};

预设可以包含其它预设和带有选项的插件。

JavaScript
module.exports = () => ({
  presets: [require("@babel/preset-env")],
  plugins: [
    [require("@babel/plugin-transform-class-properties"), { loose: true }],
    require("@babel/plugin-transform-object-rest-spread"),
  ],
});

要了解更多信息，请查阅 babel 手册中关于预设的部分。

预设排序

预设排序是倒序（从最后一个到第一个）。

babel.config.json
{
  "presets": ["a", "b", "c"]
}

将按以下顺序运行：c，b，然后 a。

这主要是为了确保向后兼容，因为大多数用户在 "stage-0" 之前列出了 "es2015"。

预设选项

插件和预设都可以通过将名称和选项对象包装在你的配置的一个数组内来指定选项。

如果指定可选项，以下都是等效的：

babel.config.json
{
  "presets": [
    "presetA", // 单字符串
    ["presetA"], // 包装在数组中
    ["presetA", {}] // 第 2 个参数是一个空的配置对象
  ]
}

若要指定选项，请传递一个以键作为选项名称的对象。

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

官方预设​

其它集成​

使用预设​

Stage-X (实验性预设)​

创建预设​

预设排序​

预设选项​