pantoken / visual-debug

visual-debug ​

Beta

@pantoken/plugin-visual-debug — InstUI 的 withVisualDebug 属性的 CSS。

InstUI 的布局基元（View、Flex、Grid、List、…）接受 withVisualDebug 来在调试布局时为盒子及其子元素描边。 该插件输出单个以短横线为前缀的修饰符， -with-visual-debug，可作用于任何元素（可与任何基础复合，例如 .instui-view -with-visual-debug）。描边颜色由 --pantoken-visual-debug-color 自定义属性控制 （默认是鲜亮的洋红色），因此便于重新着色。

示例 ​

ts
import { toCss } from "@pantoken/css";
import { byTheme } from "@pantoken/tokens";
import { visualDebug } from "@pantoken/plugin-visual-debug";

const css = toCss(byTheme("rebrand"), { plugins: [visualDebug()] });
// <div class="instui-view -with-visual-debug">…</div>

接口 ​

变量 ​

函数 ​

引用 ​

default ​

重命名并重新导出 visualDebug