Skip to content

pantoken / flatten-property

flatten-property

베타

@pantoken/plugin-flatten-property@property at-rules를 일반 커스텀 속성 선언으로 변환합니다.

@property at-rules는 syntax, inherits, 및 initial-value 설명자를 사용해 타입화된 CSS 커스텀 속성을 등록합니다. 이들은 상당한 바이트 오버헤드(속성당 약 60바이트의 보일러플레이트)를 발생시키며, 스타일시트가 자체 포함된 번들로서 타입 등록이 런타임 이점을 제공하지 않을 때는 불필요합니다. 이 플러그인은 각 @property 블록을 선택한 선택자 안의 단순한 --name: value 선언으로 교체하여 그 모든 오버헤드를 회수합니다.

의미적 참고: @property 를 제거하면 CSS 타입 등록을 잃게 됩니다. 타입화된 전환/애니메이션, @starting-style, 그리고 CSS Typed OM이 이에 의존합니다. 이러한 의미가 필요하지 않은 번들에만 적용하세요.

예제

ts
import postcss from "postcss";
import { flattenProperty } from "@pantoken/plugin-flatten-property";
const out = postcss([flattenProperty()]).process(css, { from: undefined }).css;

인터페이스

변수