7.12.0 Lanzado: TypeScript 4.1, cadenas como nombres de importación/exportación y bloques estáticos de clase
Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →
¡Acabamos de publicar una nueva versión menor de Babel!
Esta versión incluye soporte para las nuevas características beta de TypeScript 4.1: tipos de literales plantilla y remapeo de claves en tipos mapeados.
Además, implementamos dos nuevas propuestas de ECMAScript: bloques estáticos de clase e importaciones y exportaciones con nombres de cadena.
Finalmente, renombramos @babel/plugin-syntax-module-attributes (y el plugin de análisis sintáctico correspondiente moduleAttributes) a @babel/plugin-syntax-import-assertions (e importAssertions), para alinearnos con las actualizaciones recientes de la propuesta. El plugin antiguo seguirá funcionando hasta Babel 8, pero ahora está obsoleto.
Puedes leer el registro de cambios completo en GitHub.
Si tú o tu empresa quieren apoyar a Babel y la evolución de JavaScript, pero no están seguros de cómo hacerlo, pueden donar a través de nuestro Open Collective y, mejor aún, ¡colaborar directamente con nosotros en la implementación de nuevas propuestas de ECMAScript! Como proyecto impulsado por voluntarios, dependemos del apoyo de la comunidad para financiar nuestros esfuerzos en atender a la amplia variedad de usuarios de JavaScript. Contáctenos en team@babeljs.io si desean discutir más opciones.
Destacados
TypeScript 4.1 (#12129, #12131)
La versión beta de TypeScript 4.1 se anunció hace unas semanas e incluye nuevas características de sintaxis para tipos.
Los tipos de literales plantilla permiten concatenar cadenas a nivel de tipos, usando la sintaxis de literales plantilla:
type Events = "Click" | "Focus";
type Handler = {
[K in `on${Events}`]: Function
};
const handler: Handler = {
onClick() {}, // Ok
onFocus() {}, // Ok
onHover() {}, // Error!
};
Junto con el remapeo de claves en tipos mapeados, pueden usarse para representar transformaciones complejas de objetos:
type Getters<T> = {
[K in keyof T as `get${Capitalize<K>}`]: () => T[K]
};
interface Dog { name: string; age: number; }
const lazyDog: Getters<Dog> = /* ... */;
lazyDog.getName(); // string
lazyDog.age; // error!
Puedes leer más sobre TypeScript 4.1 en el anuncio de lanzamiento, o consultar otros ejemplos de las capacidades que habilitan estas nuevas características. ¡Sin embargo, recuerda que TypeScript 4.1 todavía es experimental!
Bloques estáticos de clase (#12079, #12143)
class C {
static #x = 42;
static y;
static {
try {
this.y = doSomethingWith(this.#x);
} catch {
this.y = "unknown";
}
}
}
Esta propuesta en etapa 2 permite aplicar inicializaciones estáticas adicionales durante la evaluación de una definición de clase. No pretende reemplazar campos estáticos, sino habilitar nuevos casos de uso que antes no eran posibles. En el ejemplo anterior, la propiedad estática y se inicializa usando #x. Si doSomethingWith(this.#x) falla, y recibirá un valor predeterminado "unknown".
Puedes leer más detalles en la descripción de la propuesta.
Gracias a Jùnliàng, puedes probar esta propuesta instalando
el plugin @babel/plugin-proposal-class-static-block y agregándolo a tu configuración de Babel. Como probablemente ya uses otros plugins para características de clases, asegúrate de colocar este plugin antes que los demás:
{
"plugins": [
"@babel/plugin-proposal-class-static-block",
"@babel/plugin-proposal-class-properties"
]
}
Babel implementa una versión actualizada de la especificación, que incorpora retroalimentación que proporcionamos basada en la especificación actual.
Importaciones y exportaciones con nombres de cadena (#12091)
Se alcanzó consenso durante la última reunión del TC39 mediante un PR que permite usar cadenas como nombres de variables importadas y exportadas:
// emojis.js
let happy = "wooo!";
export { happy as "😃" };
// main.js
import { "😃" as smile } from "./emojis.js";
console.log(smile); // wooo!
Esto permite utilizar cualquier nombre UTF-16 válido entre módulos, haciendo a JavaScript totalmente compatible con otros lenguajes como WebAssembly.
Puedes habilitar soporte de análisis sintáctico para esta característica agregando @babel/plugin-syntax-module-string-names a tu configuración:
{
"presets:" ["@babel/preset-env"],
"plugins": [
"@babel/syntax-module-string-names"
]
}
Esta característica se habilitará por defecto tan pronto como la sintaxis se integre en la especificación principal de ECMAScript.
Nota que no es posible transpilar cadenas arbitrarias a importaciones/exportaciones estilo ES2015: solo se transpilarán cuando se apunte a un sistema de módulos diferente como CommonJS.
Análisis de aserciones de importación (#12139)
La propuesta de "atributos de módulo" ha cambiado significativamente y se ha renombrado a "aserciones de importación".
Hemos implementado soporte de análisis sintáctico para esta nueva versión de la propuesta, que puede habilitarse usando el plugin @babel/plugin-syntax-import-assertions (o, si usas @babel/parser directamente, importAssertions):
{
"plugins": [
- ["@babel/syntax-module-attributes", { "version": "may-2020" }]
+ "@babel/syntax-import-assertions"
]
}
Los cambios sintácticos más relevantes son que la palabra clave with se reemplazó por assert y las aserciones ahora se envuelven entre llaves:
import json from "./foo.json" assert { type: "json" };
import("foo.json", { assert: { type: "json" } });
Puedes leer más sobre estos cambios en el README de la propuesta.
@babel/plugin-syntax-module-attributes seguirá funcionando hasta que lancemos Babel 8.0.0, pero ya no se mantendrá, por lo que recomendamos migrar al nuevo plugin.