pantoken / mangle-custom-props

mangle-custom-props ​

เบต้า

@pantoken/plugin-mangle-custom-props — เปลี่ยนชื่อ property ที่กำหนดเองยาว ๆ ให้เป็นตัวระบุเรียงลำดับสั้น ๆ ที่กระชับ

ชื่อตัว token อย่าง --instui-component-alert-border-top-style อ่านได้สำหรับมนุษย์แต่มีต้นทุนสูงใน บันเดิลที่ถูกย่อ: ชื่อเองมีขนาด 40+ ไบต์ ถูกทำซ้ำทั้งในคำนิยาม ในทุกการเรียก var(), และในทุกการลงทะเบียน @property. ปลั๊กอินนี้จะแทนที่ชื่อที่ตรงกันทั้งหมด — ข้ามคำนิยาม, การอ้างอิง var() และพารามิเตอร์ @property — ด้วยตัวระบุสั้นที่สุด (--a, --b, …, --aa, …), ลดค่าใช้จ่ายจากชื่อลงประมาณ ~90%.

ชื่อจะถูกเก็บจากสไตล์ชีตทั้งหมด เรียงตามลำดับตัวอักษรเพื่อให้การแมปมีความกำหนดได้ แล้วจึงมอบหมายเป็นลำดับต่อเนื่อง ตัวเลือก MangleCustomPropsOptions.sharedManifest อนุญาตให้หลาย รอบการประมวลผล PostCSS แยกต่างหากใช้การแมปเดียวกันได้ ดังนั้นไฟล์ CSS ที่ถูกประมวลผลแยกกันแต่ จะถูกโหลดร่วมกันจึงสามารถถูกมังเกิ้ลด้วยชื่อชุดเดียวได้อย่างปลอดภัย.

ตัวอย่าง ​

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

อินเทอร์เฟซ ​

นามแฝงชนิด ​

ตัวแปร ​