Skip to main content

7.27.0 Released: better ecosystem alignment

· 3 min read
Babel Team

Babel 7.27.0 is out!

This release doesn't include any significant new feature, but it better aligns Babel's behavior with standard JavaScript and other tools.

The code printer will now also print the correct import attributes syntax by default, rather than expecting its users to explicitly enable an option for it.

We also tweaked the behavior of @babel/preset-typescript's rewriteImportExtensions option, to fix some differences when compared to TypeScript's --rewriteRelativeImportExtensions.

Lastly, we updated our estree compatibility plugin in @babel/parser to generate AccessorProperty nodes for accessor foo = "val" class properties, introduced by the decorators stage 3 proposal. Note that, for legacy compatibility reasons, @babel/parser only generates an ESTree-compatible AST for class features when the classFeatures option of the estree plugin is enabled.

There are multiple changes that may benefit plugin authors: you can read the whole changelog on GitHub.

If you or your company want to support Babel and the evolution of JavaScript, but aren't sure how, you can donate to us on our Open Collective and, better yet, work with us on the implementation of new ECMAScript proposals directly! As a volunteer-driven project, we rely on the community's support to fund our efforts in supporting the wide range of JavaScript users. Reach out at team@babeljs.io if you'd like to discuss more!

Highlights​

rewriteImportExtensions tweaks (#17118)​

Babel 7.26.0 added support for dynamic import() when using the rewriteImportExtensions option of @babel/preset-typescript, to align with TypeScript's new rewriteRelativeImportExtensions.

However, we then found a difference when it comes to handling non-relative paths: Babel would rewrite import("/foo/bar/baz.ts") to import("/foo/bar/baz.js"), while TypeScript would leave it as-is. As Babel's goal is to mirror TypeScript's option when possible, we consider this difference to be a bug and we are fixing it in Babel 7.27.0.

Babel first implemented import attributes years ago, when the proposal was still called "module attributes" and had a different syntax:

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

When we shipped standards-compliant import attributes, we kept the existing generator behavior. This means that when printing the following AST:

ImportDeclaration {
  specifiers: [],
  source: StringLiteral("./data.json"),
  attributes: [
    ImportAttribute { key: Identifier("type"), value: StringLiteral("json") }
  ]
}

we would generate import "./data.json" with type: "json" instead of import "./data.json" with { type: "json" }.

@babel/generator will not generate import "./data.json" with { type: "json" }, to match standard JavaScript syntax. It will keep generating the old syntax when either:

  • The importAttributesKeyword option is set to "with-legacy"
  • The AST has been generated by parsing the old syntax, which will define a .extra.deprecatedWithLegacySyntax: true property on the ImportDeclaration node.