pantoken / mangle-custom-props

mangle-custom-props

Beta（測試）

@pantoken/plugin-mangle-custom-props — 將長的自訂屬性名稱重新命名為最小的順序識別符。

像 --instui-component-alert-border-top-style 這類的代幣名稱對人類可讀，但在壓縮後的套件中很昂貴：名稱本身就有 40+ 位元組，會在定義中重複出現、每次 var() 呼叫中出現， 以及每次 @property 註冊時出現。此外掛會將每個匹配的名稱（跨定義、var() 參考，以及 @property 參數）替換為最小的識別符（--a, --b, …, --aa, …），將名稱開銷減少約 90%。

名稱會從整個樣式表收集，按字母順序排序以取得確定性對應，然後依序指派。一個 MangleCustomPropsOptions.sharedManifest 選項允許多個獨立的 PostCSS 執行共用一致的對應，因此將會一起載入的分別處理的 CSS 檔案，可以安全地使用相同名稱進行混淆。

範例

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

介面

• MangleCustomPropsOptions

型別別名

• MangleMethod

變數

• mangleCustomProps