pantoken / mangle-custom-props

mangle-custom-props ​

Beta

@pantoken/plugin-mangle-custom-props — lange benutzerdefinierte Eigenschaftsnamen in minimale sequentielle Bezeichner umbenennen.

Tokennamen wie --instui-component-alert-border-top-style sind für Menschen lesbar, aber in minifizierten Bundles teuer: der Name selbst ist 40+ Bytes groß, erscheint in der Definition, bei jedem var()-Aufruf, und bei jeder @property-Registrierung. Dieses Plugin ersetzt jeden passenden Namen — in Definitionen, var()-Referenzen und @property-Parametern — durch einen minimalen Bezeichner (--a, --b, …, --aa, …), wodurch der Namens-Overhead um etwa 90% reduziert wird.

Namen werden aus dem gesamten Stylesheet gesammelt, alphabetisch sortiert für eine deterministische Zuordnung und dann sequentiell zugewiesen. Eine MangleCustomPropsOptions.sharedManifest-Option erlaubt es mehreren separaten PostCSS-Durchläufen, eine konsistente Zuordnung zu teilen, sodass separat verarbeitete CSS-Dateien, die zusammen geladen werden, sicher mit denselben Namen gemangelt werden können.

Beispiel ​

ts
import postcss from "postcss";
import { mangleCustomProps } from "@pantoken/plugin-mangle-custom-props";
const out = postcss([mangleCustomProps()]).process(css, { from: undefined }).css;

Schnittstellen ​

Typ-Aliasse ​

Variablen ​