Skip to content

pantoken / plugins/postcss/props-minify/src / mangleCustomProps

Փոփոխական: mangleCustomProps

const mangleCustomProps: {(options?): Plugin; postcss: true; }

Բետա

Ստեղծել mangle-custom-properties PostCSS plugin-ը։

Ըմբռնում է declaration props-երից prefix-ին համապատասխանող բոլոր custom property անունները, var() հղումներն ու @property պարամետրերը. Վերլուծում է դրանք այբբենական կարգով՝ կայուն, որոշորոշիչ (deterministic) քարտեզագրում ստանալու համար, ապա ներդնում է կարճ անուններ՝ ընտրված method-ով: Փոխարինում է յուրաքանչյուր հանդիպումը ամբողջ stylesheet–ում։

Type Declaration

Պարամետրեր

options?

MangleCustomPropsOptions

MangleCustomPropsOptions.

Վերադարձվող արժեք

Plugin

PostCSS Plugin:

postcss

postcss: true

Պահանջվող PostCSS plugin նշիչ:

Օրինակներ

Մանգլ՝ լռելյայն կարգավորումների հետ (--instui-\*, base26)

ts
import postcss from "postcss";
import { mangleCustomProps } from "@pantoken/plugin-mangle-custom-props";

const out = postcss([mangleCustomProps()]).process(css, { from: undefined }).css;

Կիսել քարտեզագրումը երկու միասին բեռնվող ֆայլերի միջև

ts
import postcss from "postcss";
import { mangleCustomProps } from "@pantoken/plugin-mangle-custom-props";

const manifest = new Map<string, string>();
const tokenCss = postcss([mangleCustomProps({ sharedManifest: manifest })]).process(tokens, { from: undefined }).css;
const componentCss = postcss([mangleCustomProps({ sharedManifest: manifest })]).process(components, { from: undefined }).css;
// both files use the same --instui-* → --a mapping

Օգտագործել base36 անուններ և արտադրել քարտեզագրումը result.messages-ի միջոցով

ts
import postcss from "postcss";
import { mangleCustomProps } from "@pantoken/plugin-mangle-custom-props";

const result = postcss([mangleCustomProps({ method: "base36", propertyMap: true })]).process(css, { from: undefined });
const msg = result.messages.find((m) => m.type === "mangle-map");