pantoken / flatten-property

flatten-property ​

Bèta

@pantoken/plugin-flatten-property — zet @property at-rules om naar gewone custom-property declaraties.

@property at-rules registreren getypeerde CSS custom properties met syntax, inherits en initial-value descriptors. Ze brengen een aanzienlijke byte-overhead met zich mee — ~60 bytes boilerplate per eigenschap — en zijn overbodig wanneer het stylesheet een zelfvoorzienend bundel is waarbij type registratie geen runtime-voordeel biedt. Deze plugin vervangt elk @property blok door een simpele --name: value declaratie binnen een gekozen selector, waardoor al die overhead wordt teruggewonnen.

Semantische opmerking: het verwijderen van @property betekent verlies van CSS type-registratie. Getypeerde transitions/animaties, @starting-style, en de CSS Typed OM zijn hiervan afhankelijk. Alleen toepassen op bundels waar die semantiek niet nodig is.

Voorbeeld ​

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

Interfaces ​

Variabelen ​