7.11.0发布：preset-env中的ECMAScript 2021支持，TypeScript 4.0支持，打印配置和`babel-eslint`的未来

我们刚刚发布了Babel的一个新的小版本!

这个7.11版本包括

preset-env 支持逻辑赋值 ( )、数字分隔符 ( )和命名空间的重新输出 ( )??=``1_2``export * as ns from ...
支持TypeScript 4.0
解析器支持Stage-1Decimal提案(7.11m)
一个环境标志来打印给定文件的已解决的Babel配置 (BABEL_SHOW_CONFIG_FOR)

除此以外，我们现在发布了babel-eslint 的后续版本：@babel/eslint-parser!

你可以在GitHub上阅读整个更新日志。

此外，如果你有任何问题或想讨论的东西，我们已经在我们的仓库上启用了GitHub讨论功能

如果你或你的公司想支持Babel和JavaScript的发展，但不确定如何支持，你可以在我们的开放集体中为我们捐款，更好的是，直接和我们一起实现ECMAScript的新提案作为一个志愿者驱动的项目，我们依靠社区的支持来资助我们支持广大的JavaScript用户。如果你想讨论更多，请联系team@babeljs.io!

支持ECMAScript 2021(#11864)

在上次会议中，TC39将逻辑赋值和数字分隔符的提案移到了第四阶段！Babel已经通过支持这些提案来支持这些提案。Babel已经通过@babel/plugin-proposal-logical-assignment-operators 和@babel/plugin-proposal-numeric-separators 插件支持这些提议。现在它们被包含在@babel/preset-env ，并根据你的目标进行编译，就像其他ECMAScript特性一样。

逻辑赋值

逻辑赋值提供了一个结合逻辑运算符和赋值表达式的速记符号。

this.disabled ??= false;
this.disabled ?? (this.disabled = false);

clicked &&= !isDoubleClicked();
clicked = clicked && !isDoubleClicked();

hasDups ||= (prev === cur);
if (!hasDup) hasDups = (prev === cur);

数值分隔符

数字分隔符(_)是一个可以在数字字段中的数字之间插入的字符，以帮助实现视觉上的分隔。

1_000_000_000
0.000_000_000_1

从 （#11849）导出命名空间

一个导入的模块可以作为一个新的命名空间重新导出。

export * as ns from "mod";

ℹ️这已经包含在ECMAScript 2020中了，但还不被@babel/preset-env 支持。

从7.11版本开始，如果caller 支持的话，@babel/preset-env 会跳过@babel/plugin-proposal-export-namespace-from ：这可以让export * as ns 按原样直接被捆绑器处理。注意：babel-loader 和@rollup/plugin-babel 还没有告诉 Babel 他们支持这种语法，但我们正在和相关的维护者一起研究。

如果设置了{ modules: false } ，Babel会认为转码后的代码会在有本地ESM支持的引擎中运行。export * as ns ，就像其他ECMAScript特性一样，会基于targets 进行编译。

如果您打算捆绑转置的代码，请删除{ modules: false } 选项。默认情况下，preset-env 将根据caller 从babel-loader 和@rollup/plugin-babel 传递的数据来决定模块的转换。

{
  "presets": [
    ["@babel/env", {
      "targets": ["defaults"],
-     "modules": false,
    }]
}

如果你为modules 选项提供了一个不同的值，export * as ns 将始终被转换。

如果你直接使用任何一个

@babel/plugin-proposal-export-namespace-from
@babel/plugin-proposal-logical-assignment-operators
@babel/plugin-proposal-numeric-separators

你可以从你的配置中删除它们，因为它们将被默认包含。

{
  "presets": [
    ["@babel/env", { "targets": ["defaults"] }]
  ],
  "plugins": [
-   "@babel/plugin-proposal-export-namespace-from",
-   "@babel/plugin-proposal-logical-assignment-operators",
-   "@babel/plugin-proposal-numeric-separators"
  ]
}

支持TypeScript 4.0

TypeScript 4.0引入了几个新特性。

变体元组类型

你现在可以在元组类型中指定通用的传播，传播可以在任何位置。

type Arr = readonly any[];

function collect<L extends Arr, M extends Arr>(b: boolean, l: L, m: M): [boolean, ...L, ...M] {
  return [b, ...l, ...m];
}

标记的元组元素

元组元素现在可以被标记了：

type Log = [failed: boolean, reason?: Error, ...stacks?: string[]]
// same as
type Log = [boolean, Error?, string[]?];

`unknown` on 条款绑定`catch`

你可以指定catch 子句变量的unknown 类型：

try {
  // ...
} catch (e: unknown) {
  // type error! Error() only accepts string | undefined
  throw new Error(e);

  if (typeof e === "string") {
    // e is a string
    throw new Error(e);
  }
}

请注意，目前只有unknown 和any 允许抓取绑定类型注释。@babel/parser 不执行这种检查，因为类型别名 (type ANY = any) 和交叉 (any | unknown) 都不是在编译时评估的。

从Babel 7.11开始，你可以使用这些新功能，而不需要改变任何配置。欲了解更多信息，请查看TypeScript 4.0公告。

十进制字面分析器支持

十进制文字提案（Stage 1）提供了一个十进制数字的符号，类似于BigInt和整数。

0.1m + 0.2m === 0.3m; // true

Babel现在支持解析这些字面符号：您可以在Babel配置中添加@babel/plugin-syntax-decimal 插件，如果您直接使用@babel/parser ，可以启用decimal 插件。Babel不提供小数的polyfill实现。

打印配置

Babel可以通过多种方式进行配置（以编程方式或通过JSON/JavaScript配置）。然而，这种灵活性并不是免费的：要了解您的项目中哪些是适用的配置文件，以及Babel如何合并这些配置，可能会很困难。你也可以间接地使用Babel，而配置是由驻扎在你的node_modules中的一个包生成的。所有这些用例都表明，需要一种方法来输出配置信息，以帮助调试任何编译问题。

Babel 7.11为此提供了一个环境变量：

# *nix or WSL
BABEL_SHOW_CONFIG_FOR=./src/myComponent.jsx npm start

$env:BABEL_SHOW_CONFIG_FOR = ".\src\myComponent.jsx"; npm start

将打印应用在src/myComponent.jsx 的有效配置。

请查看配置的详细用法和输出示例。

`@babel/eslint-parser`

babel-eslint 已经被移到了Babel的Monorepo中，有了新的名字：。它在Babel和ESLint之间提供了更好的整合，并具有完整的ES2020支持。在《@babel/eslint-parser babel-eslint》博文中，Kai补充了更多关于的状态。@babel/eslint-parser

7.11.0发布：在preset-env中支持ECMAScript 2021，支持TypeScript 4.0，打印配置和`babel-eslint`的未来