Skip to content

pantoken / flatten-property

flatten-property

Beta

@pantoken/plugin-flatten-property — convertir las at-rules @property en declaraciones sencillas de propiedades personalizadas.

@property at-rules registran propiedades personalizadas tipadas de CSS con descriptores syntax, inherits y initial-value. Suponen una sobrecarga de bytes significativa — ~60 bytes de código repetitivo por propiedad — y son innecesarias cuando la hoja de estilos es un paquete autocontenido en el que el registro de tipos no aporta beneficio en tiempo de ejecución. Este plugin reemplaza cada bloque @property por una simple declaración --name: value dentro de un selector elegido, recuperando toda esa sobrecarga.

Nota semántica: eliminar @property elimina el registro de tipos de CSS. Las transiciones/animaciones tipadas, @starting-style y la CSS Typed OM dependen de ello. Aplicar sólo a bundles donde esas semánticas no sean necesarias.

Ejemplo

ts
import postcss from "postcss";
import { flattenProperty } from "@pantoken/plugin-flatten-property";
const out = postcss([flattenProperty()]).process(css, { from: undefined }).css;

Interfaces

Variables