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

Değişken: mangleCustomProps ​

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

Beta

mangle-custom-properties PostCSS eklentisini oluşturun.

Bildirim özelliklerinden prefix ile eşleşen tüm özel özellik adlarını, var() referanslarını ve @property parametrelerini toplar. Kararlı, belirlenebilir bir eşleme için bunları alfabetik olarak sıralar, ardından seçilen method kullanarak kısa isimler atar. Stil sayfası boyunca her ortaya çıkışını bu kısa isimlerle değiştirir.

Type Declaration ​

Parametreler ​

options? ​

MangleCustomPropsOptions

MangleCustomPropsOptions.

Döndürür ​

Plugin

Bir PostCSS Eklentisi.

postcss ​

postcss: true

Gerekli PostCSS eklentisi işareti.

Örnekler ​

Varsayılanlarla mangle (--instui-\*, base26)

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

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

Birlikte yüklenen iki dosya arasında eşlemeyi paylaşın

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 isimlerini kullanın ve eşlemeyi result.messages aracılığıyla yayınlayın

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");