Skip to content

pantoken / props-minify

props-minify

ベータ

@pantoken/plugin-props-minify — 単一の applyMinify ユーティリティを介して、--instui-* カスタムプロパティに対する prune、flatten、mangle トランスフォームを合成します。

各 CSS 出力パイプライン(generate スクリプト、レンダラー)は、直接 PostCSS に依存せずに一貫した圧縮インターフェースのために applyMinify を使用します。

Prune + mangle はすべての var(--instui-*) 参照と定義が同一出力内にある自己完結型バンドルでのみ安全です。 別ファイルの利用者(@pantoken/css および @pantoken/components を個別に読み込む場合)には、{ flatten: true } のみを適用してください。

ファイル境界を越えた Mangle: 一緒に読み込まれる CSS ファイルを処理する各 applyMinify 呼び出しに、同じ Map インスタンスを mangle.sharedManifest として渡してください。まずトークンシートを処理(マニフェストにシード)し、その後コンポーネントシートを処理します。

3つのトランスフォームすべてを自己完結型バンドルに適用する

ts
import { applyMinify } from "@pantoken/plugin-props-minify";
const out = applyMinify(css, { prune: true, flatten: true, mangle: true });

Flatten のみ(別ファイル利用者に安全)

ts
import { applyMinify } from "@pantoken/plugin-props-minify";
const out = applyMinify(css, { flatten: true });

同じマッピングで 2 つのファイルを Mangle する

ts
import { applyMinify } from "@pantoken/plugin-props-minify";
const manifest = new Map<string, string>();
const tokenCss = applyMinify(rawTokens, { mangle: { sharedManifest: manifest } });
const componentCss = applyMinify(rawComponents, { mangle: { sharedManifest: manifest } });

インターフェース

型エイリアス

変数

関数