@duro-app/cli (英语)
杜罗设计系统的机能可调取文件. 一看一看一看动词
生成的登记册:组件道具和使用指南、可操作的食谱,
设计标志和关键规则——作为人的产出, --json,或 MCP 程序
服务器。 零运行时间依赖关系.
npx @duro-app/cli manifest --json # the one-call agent bootstrap
npx @duro-app/cli Button # props, usage, example, related
npx @duro-app/cli Select --part Root
npx @duro-app/cli login-form --source-only > src/LoginForm.tsx
npx @duro-app/cli spacing # token scale + the deep import to copy
npx @duro-app/cli rules # critical rules + what the lint plugin enforces
npx @duro-app/cli "tags that wrap" # free text falls back to a need-search
npx @duro-app/cli list
npx @duro-app/cli hook install # wire the Claude Code session + plan-mode hooks
npx @duro-app/cli skill install # /duro-mockup plus the colors, typography and ui skills
npx @duro-app/cli mockup seed --out docs/mockups/approvals # token-seeded artboard
npx @duro-app/cli mockup check docs/mockups/approvals/*.dc.html
npx @duro-app/cli mockup canvas docs/mockups/approvals # one review page
为短本安装 : pnpm add -D @duro-app/cli → duro Button。 。 。 .
退出代码 : 0 ok \fn微软雅黑okay \fn微软雅黑okay \fn方正黑体简体\fs18\b1\bord1\shad1\3ch2f2f2f}美国海军陆战队 1 未找到(使用"您的意思") 2 使用错误 ^
3 不可读/不兼容的登记册.
MCP 服务器
claude mcp add duro-ds -- npx -y -p @duro-app/cli -p @modelcontextprotocol/sdk duro mcp
工具 : duro_ds_lookup (与CLI相同的倒向搜索行为),
duro_ds_list, (中文(简体) ), duro_ds_manifest, (中文(简体) ), duro_ds_mockup_check (艺术板的 HTML )
中,调查结果——见下文), duro_ds_mockup_canvas (艺术品板的HTML在
评论页出处)。 资源: duro://component/<Name>, (中文(简体) ),
duro://recipe/<name>。提示: duro/build-ui 以
关键规则和组成部分指数。 SDK 是一个可选的对等器 :
CLI从不装入.
登记处
registry.json 由 :
scripts/build-registry.mjs (ts-thorm,只建时)和承诺:
总计 57 *.meta.ts 文档,从
typeScript 源、 食谱源重写为可出版导入
符号缩放和规则元数据。 这是源的纯粹功能
树——排序的密钥,没有时间戳——所以 --check (在预建,CI,和
amont预推钩)是一个字节比较. 同样的脚本维持
产生区域--write-docs 编号 : --check-docs) (中文(简体) ).
CLI和 @duro-app/ui 以锁定步骤发布; 版本不匹配
当地安装的 ui 打印出一行的 stderr 警告.
撰写 relatedTo
每个 relatedTo 条目声明 a kind,该类型要求:
relatedTo: [
{
component: 'Menu',
kind: 'contrast',
relationship: 'Menu triggers actions; Select picks a value',
},
{component: 'Field', kind: 'composition', relationship: 'Place Select inside Field.Root'},
]
contrast- 两者是不同的,你选一个 改为 页:1 其它部分。 这些成为会话启动的相邻表,所以写下 因此,它决定 无论是 方向 :X for A; Y for B没有 "虚拟等同"(两者中哪一种是垂直的?).composition-一个 内部 对方,或 发展于 这个. 反相作曲,所以这个包括"道具","回相","出相","出相",不是 只是字面上的筑巢。 这些是自己的桌子:作为“投入诉 Field"他们会读成相反的建议.
将边缘置于错误的类别之下, 使得它置于一个与之相矛盾的标题之下
因此,这个字段不是可选的,也不是可以推断的。 写
要匹配的关系: a contrast 边缘决定 ("X for A; Y for B"), a
composition 边缘说什么包装什么.
Claude 代码会话钩
duro hook session-start 印出首个序言, 完整的目录,
和两个相邻的表格,设计为由
克劳德代码 SessionStart 钩子 - 所以"在建造前检查设计系统
UI"不再是一个记忆犹新的步骤 一个特工可以跳过.
该目录回答"什么存在". 表格回答了两个问题 不,这就是 特工们实际上错了:
- 取相邻 —— 选择中创建的菜单,其中的卡片 B. 小组
- 组合——不要手摇手摇 - 一个手卷的标签旁边
本应包入的输入
Field.Root
三艘船都注射,所以没有人等待 duro <Component> 调用
经纪人可能永远也做不了 这些表格是 contrast 财务报告和审定财务报表 composition
每个组件的边缘 relatedTo 见上文.
每一次消耗的回波电线都一样, 而CLI做接线:
npx -y @duro-app/cli hook install # wire this repo
npx -y @duro-app/cli hook install --check # CI: exit 1 if it drifted
install 并碰上了四个文件:
| 文件 | 安装什么 |
|---|---|
.claude/hooks/duro-catalog.sh | 写入生成的钩子: 获取目录, 缓存它7天( npx 分辨率主导会话开始; 目录仅在升级时更改) , 在离线没有缓存时保持沉默 。 然后运行 duro doctor --session,仅在文件读取更改时重新运行. |
.claude/hooks/duro-plan.sh | 写入生成的 计划模式。 。 。 . |
.claude/settings.json | 添加 SessionStart 财务报告和审定财务报表 UserPromptSubmit 条目。 现有的钩子,权限和技能上覆被保存;手取名的德罗指令被移入正位,而不是被复制. 无可救药的JSON被报告, 从来没有被打乱. |
.gitignore | 忽略 .claude/.duro-session.cache* 因为钩子杀了中..npx 离开中转 .tmp 后面 后面那个. |
不要手动编辑生成的脚本—— --check 是一个字节比较,所以
编辑显示为漂移和下一个 install 覆盖了它. 特定雷波
警告进去 .claude/duro-hook.local.md: 文件后面的钩子附件
编目 和再生 离开它独自。 用它来做那些东西
一般性的序言不能知道——地方的造型公约,什么是不能转换的,
禁止使用的包件 :
This repo specifically (see CLAUDE.md): the raw-markup convention licenses
raw div/span MARKUP around Duro components — it is NOT a license to
hand-roll widgets the DS ships.
线 --check 进入 Repo 的 lint 或 CI 任务 捕捉 Stale 钩后
CLI升级. 生成的脚本针 @duro-app/cli@^5.0.0 - 一个浮起
针,所以补丁释放 从来没有读作漂移,但 楼层: 其
脚本仍然指针 ^3.4.0 永远无法解决4.x载荷 也看不到什么
从此获得了会话启动注入。 该释放拒绝一个标签:
主要与该层不同(scripts/check-pin-major.mjs) (中文(简体) ). 一个少校后,
重新运行 hook install (和 skill install,它也刷新了每个消费者的颜色、打字和ui技能:缓存
记录它被取走的地层, 所以下届的会场调整它
自己,一个失败的反弹 说在stderr.
计划模式
第二个钩子运行在克洛德代码 UserPromptSubmit会议期间
在计划模式下( 该事件为 permission_mode 实值 "plan")它增加了五行
规划者的背景:增加新屏幕或制作材料的计划
在布局、等级或互动中选择,从选择方向开始——
装入 duro-mockup 绘制 2–4 个方向 duro mockup 在此之前
ExitPlanMode (自由决定) handoff.fresh-directions-trigger) (中文(简体) ). 一个固定
恢复现有设计的被选中的艺术板再利用; 任何其他 UI 更改
不用装模作样 计划时有了新的方向
输入 /duro-mockup。 。 。 .
计划外模式,在任何有效载荷上,它都无法读取,它不会印出任何东西。 这个
每一时每刻都运行,所以它是明显的 sh 和一个 grep 在事件JSON -
没有npx,节点,没有网络——每条路径出口0:它永远无法阻断或
失败的提示。 现有 UserPromptSubmit 钩入 settings.json 保留;
德罗条目加入数组.
扩展( 绿色 )
@duro-app/cli 同时是 design 扩展 灰尘, (中文(简体) ),
绿色哈内斯安装器. greenharness.toml 包根是 grh 显示 v1; 安装
它来自一个依赖于CLI的寄存器:
grh install --extension node_modules/@duro-app/cli
或,在没有当地依赖的情况下:
npm pack @duro-app/cli@6 && tar -xzf duro-app-cli-6*.tgz && grh install --extension package
每一个显示的条目都做了些什么:
| 条目 | 什么鬼东西 |
|---|---|
[[skill]] × 4 | 页:1 colors, (中文(简体) ), typography, (中文(简体) ), ui 财务报告和审定财务报表 duro-mockup 技能,复制到 ~/.claude/skills/ |
[[agent]] | design-system-lookup:给出一个计划,解答其UI从目录中需要的 design-lookup 块 |
[[mcp]] | 页:1 duro-ds MCP 服务器( U)duro mcp,通过 npx),为用户注册 |
[[session_context]] | duro context:目录,然后是医生块; 沉默在杜罗消费者之外,在哪里 duro hook install 已经运行 |
[[doctor]] | duro doctor,显示为 grh status(在杜罗消费者之外沉默) |
技能门本身:每个门都打开,说它只适用于一个储存库,而储存库是: package.json
取决于 @duro-app/ui 联合国 workspace: 依赖性也算数),在别处停止,所以
用户级安装成本 其他寄存器没有。 两个会话命令是 sh -c 警卫
除非根同时退出 package.json,或一个 package.json 下有一两个目录,名字
@duro-app/。 。 。 .
duro context 打印目录 duro hook session-start 印数(现在代表
duro context --catalog-only)然后是 doctor --session 块,仅在构建文件时重新运行“
关键更改。 它的缓存是 ${XDG_CACHE_HOME:-~/.cache}/duro/<repo path hash>: 写给临时
文件并重新命名, 一个失败的写入是沉默的, 并且没有在仓库中创建任何内容 .claude/。 。 。 .
duro hook install 财务报告和审定财务报表 duro skill install 仍然和以前一样工作,并在 stderr 上再打印一行
指向这里.
德罗医生
设计系统样式表分层: reset样式X
priority1.priority5,所以一个组件的 padding-left 击败重置
padding: 0。应用程序可以在不接触组件的情况下破解
症状总是一样的——按键、输入和页面包装
几乎没有补丁时 @duro-app/ui"CSS是罚款. duro doctor 检查
app的接线, 静态, 从其包根( 或回波根: 如下)
pnpm/npm 工作空间, 否则向下查看一个目录 :
| 规则 | 严重性 | 什么样的断裂 |
|---|---|---|
runtime-injection | 错误 | runtimeInjection: true 在一个 Vite/babel 配置。 StyleX 注射反应限制大小的元素重置为无层 <style>,无阶地击出每一层。 一个警告 vitest.* (只有犹太人). |
layered-extraction | 错误 | useCSSLayers: false in postcs.config: app's 提取出的规则——反应-收缩度的重置包括——土地无分层. |
css-imported | 错误 | 条目app/root.tsx, (中文(简体) ), src/main.tsx,.)从未进口 @duro-app/ui/dist/index.css。 JavaScript 不加载; 组件不设样式. |
css-load-order | 错误 | 样式表宣布 priority* 上层 reset。第一个声明会修改页面的层次顺序,将重置置于顶端. |
unlayered-reset | 警告( e) | * { padding: 0 } (或于 button, (中文(简体) ), input, (中文(简体) ), main,(...) 任何一个 @layer 在应用程序的CSS. |
version-skew | 警告( e) | 安装 @duro-app/ui 这不是 CLI 检查的版本 . |
tokens-compiled | 警告或错误 | 一个 vite/ babel 配置与 StyleX 编译, 但是没有路径 @duro-app/tokens 结束 react-strict-dom/babel-preset (或在SSR应用中, ssr.noExternal 错过它. css.create 然后无法导入 @duro-app/tokens/tokens/*.css: StyleX 失败,“... 确保主题文件有. stylex.js 或. stylex.ts 扩展名” 。 一次错误 css.create 文件输入 app/编号 :src/ 深入道具;在此之前发出警告,因为这是设计系统规定的进口. noExternal 可能是内在的, 配置中的凸起 {noExternal} shortwand 或 Const 的兄弟模块导出; 已声明的列表从不计为路径 。 当绑定无法解决时, 一个警告名称 . |
media-var | 错误 | 已建成 CSS (build/, (中文(简体) ), dist/持有 @media 其条件为: var(--…):一个媒体查询不能读取自定义属性,所以它永远不匹配. 断点凸起至CSS未编译. 仅读出比每个配置和源文件( 封装扫描) 更新的输出; 无, 检查报告为 skipped (no fresh build) 并离开 --json checked。它无法读取的路径(除了缺失的路径)是给它命名和错误代码的警告. |
退出代码 : 0 没有发现或警告的时候, 1 何时
至少有一个错误,所以它只打开错误的门. --session 永远
出口为0. --json 指纹 {ok, findings, checked, skipped, packages}。 。 。 .
两个地方运行, 和消费回波电线:
- 每届代理会议 - 那个 会话钩
运行
doctor --session,当雷波健康而且 当它不是时,它是一个代理迎面障碍.hook install电线. - 每一个触摸到线圈的承诺 - 一个 蒙特
排成一行
greengate.conf。添加应用程序的自定义配置文件(a)vite.strict-dom.ts范围:
# stage name scope severity command
pre-commit duro-doctor *.css,package.json,root.tsx,main.tsx,vite.config.ts,vitest.config.ts,postcss.config.js,postcss.config.mjs,babel.config.js block npx -y @duro-app/cli@^6.0.0 doctor
说设计系统的口袋
在符号系统外所绘制的模版,当它是
和翻译漂移——使用了一个四向布
485种不同的颜色,其中15种在调色板中,以及执行
携带 marginTop: 23 一个生的 768px 查询每个提示规则。 三个
命令和一种技能让艺术板成为合同.
npx -y @duro-app/cli mockup seed --out docs/mockups/<screen> --name Main
npx -y @duro-app/cli mockup check docs/mockups/<screen>/*.dc.html # exit 1 on findings
npx -y @duro-app/cli mockup canvas docs/mockups/<screen> # the page to pick from
npx -y @duro-app/cli skill install # /duro-mockup + colors, typography, ui
seed 写入 .dc.html 谁 <style> 以符号打开为 已解决 自定义属性
每个主题--duro-color-bg, (中文(简体) ), --duro-spacing-md,...——名称与
@duro-app/tokens/vars.css,来自同一来源. --theme light|high-contrast 邮票 <html data-theme> 所以块开关.
--overrides <file.json> 种子一个带有符号的主题应用程序的艺术板。 文件是对象
ThemeProvider 作为 tokens因此,一个应用程序将同样的文件传递给两个:
{
"colors": {"bg": "#020803", "success": "#39ff7a"},
"typography": {
"fontFamily": "'JetBrains Mono', ui-monospace, Menlo, monospace",
"fontFamilyMono": "'JetBrains Mono', ui-monospace, Menlo, monospace"
},
"radii": {"xs": "2px", "sm": "4px", "md": "6px", "lg": "8px"},
"sizes": {"dialogSm": "360px"}
}
每组可选. 这些团体是: colors, (中文(简体) ), shadows, (中文(简体) ), typography, (中文(简体) ), typeScale, (中文(简体) ), spacing, (中文(简体) ),
layoutSpacing, (中文(简体) ), radii, (中文(简体) ), sizes, (中文(简体) ), borders, (中文(简体) ), duration, (中文(简体) ), easing 财务报告和审定财务报表 effects; 每个都有部分地图
的标记键(骆驼Case,如 duro list),每个值按其规则进行核对
类型( 颜色、 字体家族列表、 非阴性) px编号 :rem 长度, 流体 clamp() 长度,重量,
影子列表 持续时间 放松 模糊不清. layers, (中文(简体) ), breakpoints, (中文(简体) ), microSpacing, (中文(简体) ), radii.px6 财务报告和审定财务报表
radii.full 被拒绝,以及 sizes.touchTarget (44个px), borders.focusRing 2 (px) 和 (中文(简体) )
borders.focusOffset 保持他们的地板。 字体列表从应用程序负载的面孔开始 。 没有的文件
组是较早的颜色密钥平面映射( r){"bg": "#020803"}) 并且仍然有效; 文件有组
并拒绝任何其他顶级密钥(bg: unknown group (expected colors | shadows | …)) (中文(简体) ). 审定
实值 @duro-app/tokens/theme模块 ThemeProvider 使用,所以CLI拒绝应用会掉入什么.
超过部分在符号块内写为 --duro-<group>-<key> 规则--duro-color-bg, (中文(简体) ),
--duro-typography-font-family, (中文(简体) ), --duro-radius-md, (中文(简体) ), --duro-size-dialog-sm为 :root 以及两者
data-theme 以物配主,故他们得胜 check 在那里接受他们,同时仍然拒绝
其他地方的原始颜色。 成功行列出有条目的组,按组表的顺序排列(with overrides from theme.json: colors 1, typography 2, radii 4) (中文(简体) ). 缺少或非 JSON 文件、 未知的密钥或被拒绝的文件
值 出处 2 <group>.<key>: <reason> 标定值( t)radii.md: "-1px" must be 0 or a non-negative px/rem length;没有文字 --json 结果kind, (中文(简体) ), problems)仍被打印在
s. 艺术板是写给 <path>.tmp 并重新命名,所以中断运行 留下什么
屏蔽下一个种子.
check 读艺术板回来,拒绝,与 file:line rule: message数字 :
| 规则 | 查找 |
|---|---|
raw-color | 十六进制/ rgb() 编号 : hsl() 符号块外的文字, 规则或内线 style。 。 。 . |
raw-length | 相距、半径、字体、阴影或运动属性的文字(padding: 23px, (中文(简体) ), font-weight: 600, (中文(简体) ), transition: opacity 150ms) (中文(简体) ). 宽度,高度和位置是几何的,不是道具——从来没有报道过. |
raw-breakpoint | A 类 @media 编号 : @container 断点尺度外的宽度(480/640/768/1024/1280). 查询不能读取一个变量,所以比例尺上的字是正确的拼写. |
unknown-component | data-duro="<Name>" 或者说 <Name>.<Part> 登记处不知道,附有建议. |
no-component-map | 没有 data-duro 随便哪里 艺术板命名每个控件背后的组件, 否则无法执行 . |
unannotated-control | 一个像一个控制但名字没有的元素。 帆布艺术板绘制控件为 div编号 :span,所以标记不是信号:当提到它的每一条规则的结合有一个指针光标,a :hover编号 ::active编号 ::focus 状态,或加法填充。 被命名的家长只覆盖着里面一个赤裸裸的本土控制. |
当应用程序安装时 @duro-app/ui 与CLI不同, check 财务报告和审定财务报表
canvas 根据他们的调查结论说 version-skew: npx 重用任意一个
缓存了符合范围的CLI, 并且比应用程序大一个的检查器报告 a
较新的组件为 unknown-component。 。 。 .
canvas <dir> 写入 <dir>/canvas.html (单位:千美元)--out, (中文(简体) ), --title: 一个
自定义页面 *.dc.html 在目录中,组合成
按文件干排列的字母指示( x)Tree.dc.html 财务报告和审定财务报表 Tree-Phone.dc.html 为:
方向 Tree, (中文(简体) ), Main ),每个艺术板由 srcdoc 缩放
在它的框架。 它拒绝,什么都不写,而任何艺术板都失败 check。 。 。 .
以人所选择的艺术出版,或从磁盘上打开.
skill install 写入 .claude/skills/duro-mockup/SKILL.md 和每个文件
包装 colors, (中文(简体) ), typography 财务报告和审定财务报表 ui 技术 .claude/skills/<name>/
(按职等分列) --check,就像钩子; 包件不载的文件是
stale, 并仅在目录中包含已运出时安装删除
NOTICE.md) (中文(简体) ). 安装拒绝写入已存在的 colors, (中文(简体) ), typography
或者说 ui 没有这个目录 NOTICE.md 除非你通过
--force,它也删除了覆盖目录中的文件
包件不载运。 MCP服务器提供同样的三种技能作为向导:
duro_ds_lookup guide:colors,或 guide:colors/contrast.md 用于参考
文档。 该技能贯穿整个路径——种子方向,
检查, 公布画布, 执行从它的
data-duro 地图、 截取已建的路线并放置艺术板和截图
在公关中并肩作战——除了《国家行动倡议》之外,没有其他内容,而且明确
覆盖 design 技能的“提升解析值”步骤。 收押笔记进去 .claude/duro-mockup.local.md。 。 。 .
它的描述触发了对屏幕、页面或模型的请求,以及
在规划(计划模式)时,新建屏幕或材料布局、等级或
互动变化—— 计划模式 点
临τ.