跳至主内容

7.26.0 发布:默认启用 Stage 4 特性,新增实验性代码打印器

· 1 分钟阅读
非官方测试版翻译

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

Babel 7.26.0 刚刚发布!

本次更新默认启用两项在最新 TC39 会议中成为标准的 ECMAScript 提案:导入属性内联正则表达式修饰符,同时新增对Flow 枚举的解析支持。

Babel 现在允许插件提供异步的 pre/post 钩子,并新增了[实验模式](TODO: Link),可在生成转换后的代码时保留标记(token)的原始位置。

您可在 GitHub 上查阅完整更新日志。

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

重点更新

内联正则表达式修饰符 (#16692)

内联正则表达式修饰符允许仅对正则表达式的局部启用或禁用 i/m/s 标志。例如,/hello (?i:world)/ 会匹配包含原样文本 "hello " 后接任意大小写形式 "world" 的字符串:hello worldhello WoRlD 均能匹配,而 Hello world 则不会匹配。

该提案已在 2024 年 10 月的 TC39 会议上达到 Stage 4 阶段,将被纳入下一版 JavaScript 标准。@babel/preset-env 现会根据您的编译目标自动转译此特性,您可安全地从配置中移除 @babel/plugin-proposal-regexp-modifiers

若因特殊原因仍需显式引用该插件,其已更名为 @babel/plugin-transform-regexp-modifiers,因为该提案已成为标准语言特性。

导入属性 (#16579)

导入属性提案同样在 2024 年 10 月的 TC39 会议上达到 Stage 4 阶段。它支持向底层平台传递参数以指示模块加载方式:

import "./my-module" with { some_param: "hello" };

目前唯一被广泛支持的属性是 type,可用于导入 JSON 或(在 Web 环境中)CSS 模块:

import data from "./data" with { type: "json" };

Babel 现在默认解析导入属性,因此您可安全地从配置中移除 @babel/plugin-syntax-import-attributes@babel/plugin-syntax-import-assertions

警告

旧语法(使用 assert 替代 with)已从提案中移除。默认情况下 Babel 不会解析该语法。

由于该特性已成为标准 JavaScript 功能,@babel/plugin-proposal-json-modules 已更名为 @babel/plugin-transform-json-modules。请注意此插件未包含@babel/preset-env 中,因为仅当您未使用打包工具或打包工具不支持导入 JSON 模块时才需要启用它。

在动态 import() 中重写 .ts 扩展名 (#16794)

自去年起,Babel 已支持通过 @babel/preset-typescriptrewriteImportExtensions 选项在导入声明中将 .ts 扩展名重写为 .js

// Input
import { hello } from "./dep.ts";
let myVar: number = hello();

// Output
import { hello } from "./dep.js";
let myVar = hello();

我们很高兴看到 TypeScript 正在引入类似选项。但两者存在一个差异:此前 Babel 仅转换静态 import 声明中的路径(因为只有它们才能始终被静态分析),而 TypeScript 还将在动态 import 表达式中支持此重写功能。

Babel 7.26 将遵循 TypeScript 的未来行为,同样会在动态 import() 中重写扩展名:

// Input
await import("./dep.ts");
await import(url);

// Output
await import("./dep.js");
await import(url.replace(/\.ts$/, ".js")); // simplified