Skip to content

pantoken / mangle-custom-props

mangle-custom-props

Beta

@pantoken/plugin-mangle-custom-props — đổi tên các tên thuộc tính tùy chỉnh dài thành các định danh tuần tự tối giản định danh.

Các tên token như --instui-component-alert-border-top-style dễ đọc với con người nhưng tốn dung lượng trong các gói đã được tối thiểu hóa: chính tên đã chiếm hơn 40 byte, xuất hiện lặp lại trong định nghĩa, trong mỗi lời gọi var(), và trong mỗi đăng ký @property. Plugin này thay thế mọi tên khớp — trên toàn bộ định nghĩa, tham chiếu var(), và tham số @property — bằng một định danh tối thiểu (--a, --b, …, --aa, …), cắt giảm chi phí tên khoảng ~90%.

Các tên được thu thập từ toàn bộ stylesheet, sắp xếp theo thứ tự chữ cái để có ánh xạ xác định, sau đó gán theo thứ tự tuần tự. Tùy chọn MangleCustomPropsOptions.sharedManifest cho phép nhiều lần xử lý PostCSS riêng biệt chia sẻ một ánh xạ nhất quán, vì vậy các tệp CSS được xử lý riêng mà sẽ được nạp cùng nhau có thể an toàn bị rút gọn bằng cùng các tên.

Ví dụ

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

Giao diện

Bí danh kiểu

Biến