pantoken / mangle-custom-props
mangle-custom-props
Béta
@pantoken/plugin-mangle-custom-props — átnevezi a hosszú custom property neveket minimális szekvenciális azonosítókra.
Az olyan token nevek, mint a(z) --instui-component-alert-border-top-style, ember által olvashatók, de drágák a minifikált bundle-ökben: maga a név 40+ bájt, megismétlődik a definícióban, minden egyes var() hívásban, és minden @property regisztrációban. Ez a bővítmény minden egyező nevet — a definíciókban, var() hivatkozásokban és @property paraméterekben — egy minimális azonosítóra cserél (--a, --b, …, --aa, …), kb. 90%-kal csökkentve a nevek többletterhét.
A nevek az egész stíluslapból összegyűjtésre kerülnek, a determinisztikus leképezés érdekében ábécésorrendbe rendezve, majd szekvenciálisan hozzárendelve. A MangleCustomPropsOptions.sharedManifest opció lehetővé teszi, hogy több különálló PostCSS menet osztozzon egyetlen konzisztens leképezésen, így a külön feldolgozott, de együtt betöltésre kerülő CSS fájlok biztonságosan torzíthatók (mangled) ugyanazokkal a nevekkel.
Példa
import postcss from "postcss";
import { mangleCustomProps } from "@pantoken/plugin-mangle-custom-props";
const out = postcss([mangleCustomProps()]).process(css, { from: undefined }).css;