Babel 预设分析

发布时间：2023-04-12 08:52:12 所属栏目：教程来源：

导读：preset 可以作为 Babel 插件的组合，甚至可以作为可以共享的 options 配置。

Stage-X （实验性质的 Presets）
stage-x preset 中的任何语法转换都是对语言本身的更改，而这些更改尚未被纳入 JavaScript 标准（例

preset 可以作为 Babel 插件的组合，甚至可以作为可以共享的 options 配置。

Stage-X （实验性质的 Presets）
stage-x preset 中的任何语法转换都是对语言本身的更改，而这些更改尚未被纳入 JavaScript 标准（例如 ES6/ES2015）。

随时可能更改
这些提案可能会有变化，因此，特别是处于 stage-3 之前的任何提案，请务必谨慎使用。我们计划在每次 tc39 会议之后，如果有可能，在提案变更时更新 stage-x 的 preset。

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

Stage 0 - 设想（Strawman）：只是一个想法，可能有 Babel插件。

Stage 1 - 建议（Proposal）：这是值得跟进的。

Stage 2 - 草案（Draft）：初始规范。

Stage 3 - 候选（Candidate）：完成规范并在浏览器上初步实现。

Stage 4 - 完成（Finished）：将添加到下一个年度版本发布中。

有关详细信息，请务必查看 current TC39 proposals 及其 process document。

tc39 各阶段的流程也在一些文章中有详细的解释，在 Yehuda Katz (@wycatz) 的 thefeedbackloop.xyz网站上：Stage 0 and 1、Stage 2、Stage 3

创建 Preset
如需创建一个自己的 preset，只需导出一份配置即可。

可以是返回一个插件数组。

module.exports = function() {
return {
plugins: [
"pluginA",
"pluginB",
"pluginC",
]
};
}
preset 可以包含其他的 preset，以及带有参数的插件。

module.exports = () => ({
presets: [
require("@babel/preset-env"),
],
plugins: [
[require("@babel/plugin-proposal-class-properties"), { loose: true }],
require("@babel/plugin-proposal-object-rest-spread"),
],
});
有关更多信息，请参考 babel 手册中关于 preset 的部分。

Preset 的路径
如果 preset 在 npm 上，你可以输入 preset 的名称，babel 将检查是否已经将其安装到 node_modules 目录下了

{
"presets": ["babel-preset-myPreset"]
}
你还可以指定指向 preset 的绝对或相对路径。

{
"presets": ["./myProject/myPreset"]
}
Preset 的短名称
如果 preset 名称的前缀为 babel-preset-，你还可以使用它的短名称：

{
"presets": [
"myPreset",
"babel-preset-myPreset" // equivalent
]
}
这也适用于带有冠名（scope）的 preset：

{
"presets": [
"@org/babel-preset-name",
"@org/name" // equivalent
]
}
Preset 的排列顺序
Preset 是逆序排列的（从后往前）。

{
"presets": [
"a",
"b",
"c"
]
}
将按如下顺序执行： c、b 然后是 a。

这主要是为了确保向后兼容，由于大多数用户将 "es2015" 放在 "stage-0" 之前。

Preset 的参数
插件和 preset 都可以接受参数，参数由插件名和参数对象组成一个数组，可以在配置文件中设置。

如果不指定参数，下面这几种形式都是一样的：

{
"presets": [
"presetA",
["presetA"],
["presetA", {}],
]
}
要指定参数，请传递一个以参数名作为键（key）的对象。

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

（编辑：汽车网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!