7.21.0 发布：内联正则表达式修饰符、TypeScript 5.0 及装饰器更新

2023年2月20日 · 1 分钟阅读

非官方测试版翻译

本页面由 PageTurner AI 翻译（测试版）。未经项目官方认可。发现错误？报告问题 →

我们刚刚发布了 Babel 7.21.0！

Babel 现已支持内联正则表达式修饰符提案、最新版装饰器提案以及新的 TypeScript 5.0 语法。

您可以在 GitHub 上查看完整的变更日志。

如果您或您的公司希望支持 Babel 和 JavaScript 的发展，但不确定如何操作，您可以通过 Open Collective 向我们捐款，或者更好的是，直接与我们合作实现新的 ECMAScript 提案！作为志愿者驱动的项目，我们依赖社区支持来资助为广泛 JavaScript 用户提供帮助的工作。如需进一步讨论，请通过 team@babeljs.io 联系我们！

重点更新

内联正则表达式修饰符

处于 Stage 3 阶段的内联正则表达式修饰符提案允许您在正则表达式的_局部_启用或禁用 i、m 和 s 修饰符，而不影响其他部分。

您可使用 (?enableFlags:subPattern) 语法启用修饰符，(?-disableFlags:subPattern) 语法禁用修饰符，以及 (?enableFlags-disableFlags:subPattern) 语法同时启用部分修饰符并禁用其他修饰符。您可以将非捕获组 (?:subPattern) 视为不修改任何修饰符的特例。

例如，/(?i:a)a/ 会匹配一个忽略大小写的 a，后跟一个小写字母 a：

JavaScript
/(?i:a)a/.test("aa"); // true
/(?i:a)a/.test("Aa"); // true
/(?i:a)a/.test("aA"); // false

/a(?-i:a)/i 是等效的：该正则表达式忽略大小写，但第二个 a 必须为小写。

您可通过安装 @babel/plugin-proposal-regexp-modifiers 插件包并将其添加到 Babel 配置中来启用此提案：

babel.config.json
{
  "presets": ["@babel/preset-env"],
  "plugins": [
    // Add this!
    "@babel/plugin-proposal-regexp-modifiers"
  ]
}

装饰器更新

负责 JavaScript 标准化的委员会 TC39 根据 TypeScript 团队的反馈，近期批准了对装饰器提案的以下修改：

导出类的装饰器现在可以出现在 export 关键字之前或之后，但不能同时出现在两个位置：
JavaScript
```
// valid
@dec
export class A {}

// valid
export @dec class B {}

// invalid
@dec
export @dec class C {}
```
放宽此限制旨在通过减少语法差异，简化从 "旧版" 装饰器迁移的过程。

装饰器接收的 context.access 对象上的方法现在将目标对象作为第一个参数，而非 this 接收器：

JavaScript
let accessX;

function dec(desc, context) {
  accessX = context.access;
  return dec;
}

class A {
  @dec #x = 1;
}

// old semantics
accessX.get.call(new A) === 1;

// new semantics
accessX.get(new A) === 1;

context.access 新增了一个 .has 方法，用于检查对象是否包含相应元素。沿用上例：
JavaScript
```
// #x in new A
accessX.has(new A) === true;
```

您可通过将 "@babel/plugin-proposal-decorators" 的 version 选项设置为 "2023-01" 来启用此新版装饰器提案：

babel.config.json
{
  "presets": ["@babel/preset-env"],
  "plugins": [
    ["@babel/plugin-proposal-decorators", { "version": "2023-01" }]
  ]
}

您也可以在 Babel 在线 REPL 中尝试新的装饰器提案，只需在侧边栏启用 "Stage 3"（或更低阶段）预设并选择 2023-01 装饰器版本即可。

TypeScript 5.0

TypeScript 5.0 目前以测试预发布版形式推出，引入了两项新的语法特性：

类型参数的 const 修饰符

TypeScript
function getName<const T extends { name: string }>(user: T): T["name"] {
    return user.name;
}

let name = getName({ name: "Babel" });
//  ^? inferred type: "Babel", instead of just string.

export type * 声明
TypeScript
```
export type * from "./mod";
export type * as ns from "./mod";
```
Babel 依赖此新语法，在从 TypeScript 编译到 JavaScript 时安全地移除重复的 export 声明。

此外，TypeScript 5.0 引入了对标准装饰器提案的支持，您可在 Babel 中通过 @babel/plugin-proposal-decorators 启用该功能。

您可在其发布文章中阅读有关 TypeScript 新特性的更多信息！

对 `.cts` 配置文件的实验性支持

若您已安装 @babel/preset-typescript 或正通过 ts-node 运行 Babel，现可使用 babel.config.cts 作为以 TypeScript 和 CommonJS 编写的 Babel 配置文件。更多细节请参阅文档。

目前尚无法使用 babel.config.ts 和 babel.config.mts 文件，需等待 Node.js ESM 加载器 API 稳定。

Source Map 改进

Babel 生成的 Source Map 现支持友好调用帧，可在开发者工具中为转换后的函数显示更清晰的名称。

此外，@babel/generator 现可接受构建流水线中其他工具生成的输入 Source Map：这使得即使直接使用 @babel/generator（不通过 @babel/core）也能正确合并 Source Map，并提升了 Babel 中 Source Map 合并的整体性能。

重点更新​

内联正则表达式修饰符​

装饰器更新​

TypeScript 5.0​

对 .cts 配置文件的实验性支持​

Source Map 改进​