Vai al contenuto principale

7.25.0 rilasciato: correzioni per Safari e gruppi di cattura con nome duplicati

· Lettura di 4 min
Babel Team
Traduzione Beta Non Ufficiale

Questa pagina è stata tradotta da PageTurner AI (beta). Non ufficialmente approvata dal progetto. Hai trovato un errore? Segnala problema →

È uscito Babel 7.25.0!

@babel/preset-env supporta ora per impostazione predefinita la proposta dei gruppi di cattura con nome duplicati per le espressioni regolari, oltre a una correzione per i campi classe quando si targetta Safari. Questa versione migliora inoltre il supporto per la compilazione degli import di moduli JSON in CommonJS e aggiunge il supporto per i file di configurazione alla modalità --eval di @babel/node.

Puoi consultare l'intero changelog su GitHub.

Se tu o la tua azienda volete supportare Babel e l'evoluzione di JavaScript ma non sapete come, potete donare sul nostro Open Collective e, ancora meglio, collaborare direttamente con noi all'implementazione di nuove proposte ECMAScript! Essendo un progetto gestito da volontari, dipendiamo dal supporto della comunità per finanziare i nostri sforzi nell'assistere la vasta gamma di utenti JavaScript. Contattaci a team@babeljs.io per discutere ulteriormente!

Novità principali​

Gruppi di cattura con nome duplicati (#16445)​

La proposta dei gruppi di cattura con nome duplicati consente di riutilizzare lo stesso nome per gruppi in rami alternativi all'interno di un'espressione regolare. Ad esempio, un'espressione regolare che corrisponda a date nel formato dd/mm/yyyy o yyyy-mm-dd potrebbe essere scritta come:

let re =
  /(?<day>\d\d)\/(?<month>\d\d)\/(?<year>\d\d\d\d)|(?<year>\d\d\d\d)-(?<month>\d\d)-(?<day>\d\d)/;

"21/12/2023".match(re).groups.day; // 21
"2023-12-21".match(re).groups.day; // 21

La proposta ha raggiunto lo Stage 4 durante l'incontro TC39 di aprile 2024 e sarà inclusa nella prossima versione dello standard JavaScript. È quindi ora abilitata per impostazione predefinita in @babel/preset-env (quando necessario in base ai tuoi target), e puoi rimuovere in sicurezza @babel/plugin-proposal-duplicate-named-capturing-groups-regex dalla tua configurazione.

Se per qualsiasi motivo devi ancora elencare esplicitamente il plugin, è stato rinominato in @babel/plugin-transform-duplicate-named-capturing-groups-regex poiché la proposta è diventata una funzionalità standard del linguaggio.

Semplificare gli import di moduli JSON in CommonJS (#16579)​

Dopo aver introdotto il supporto per la trasformazione degli import di moduli JSON in Babel 7.24.0, abbiamo notato che l'output generato non era ottimale per i bundler CommonJS.

Dato questo codice:

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

@babel/plugin-proposal-json-modules lo compilava come segue quando si targetta CommonJS su Node.js:

const myConfig = JSON.parse(
  require("fs").readFileSync(require.resolve("./config.json"))
);

La combinazione JSON.parse + readFileSync è necessaria per garantire che config.json sia effettivamente un file JSON e non un file config.json.js che tenti di eseguire codice subdolamente durante il caricamento.

@babel/plugin-proposal-json-modules dispone ora di un'opzione uncheckedRequire per semplificare l'output, al costo di una minore validazione. Puoi abilitarla nella tua configurazione:

babel.config.json
{
  "plugins": [
    ["@babel/plugin-proposal-json-modules", { "uncheckedRequire": true }]
  ]
}

e Babel genererà il seguente codice:

const myConfig = require("./config.json");

@babel/plugin-bugfix-safari-class-field-initializer-scope (#16569)​

Le versioni di Safari precedenti alla 16 presentano un bug quando si utilizzano parentesi attorno alle espressioni nei campi di classe. Ad esempio, il seguente codice genererebbe un errore:

{
  let a = [3];
  new class {
    c = (a)[0];
  };
}

Ciò è particolarmente problematico quando si utilizza Webpack o quando si compila in CommonJS, poiché aggiungono parentesi durante la trasformazione delle importazioni. Ad esempio, questo codice di input:

import { hello } from "./dep";

class A {
  prop = hello();
}

Questo problema è particolarmente critico quando si utilizza Webpack o quando si compila in CommonJS, poiché aggiungono parentesi durante la trasformazione delle importazioni. Ad esempio, questo codice sorgente:

var _dep = /* ... */;

class A {
  prop = (0, _dep.hello)();
}

David Taylor ha implementato una correzione (grazie!) nel nuovo pacchetto @babel/plugin-bugfix-safari-class-field-initializer-scope, che è abilitato per impostazione predefinita in @babel/preset-env quando i tuoi target includono versioni di Safari precedenti alla 16.