Cursor、Claude Code、Codex都能用：Impeccable多平台安装实战

Cursor、Claude Code、Codex都能用：Impeccable多平台安装实战

【免费下载链接】impeccableThe design language that makes your AI harness better at design.项目地址: https://gitcode.com/GitHub_Trending/im/impeccable

Impeccable 是一款面向 AI 编程助手的设计技能包：一套 Skill、23 个设计命令、59 条确定性检测规则，帮你把 Cursor、Claude Code、Codex 里 AI 生成的前端页面从"模板脸"提升到"产品级"。本文是一份多平台安装实战指南，全程 1 条命令起步，5 分钟跑通。

为什么需要 Impeccable？

AI 写前端代码有个通病：同一个模型训练在同样的 SaaS 模板上，产出的页面长得几乎一样——Inter 字体包打天下、紫到蓝的渐变、卡片套卡片、标题上方必配圆角图标块。

Impeccable 做的事情很直接：

• 🎯23 个设计命令：polish、audit、critique、distill、bolder、quieter、animate……和 AI 说同一种"设计语言"
• 🔍59 条确定性检测规则：不依赖 LLM、不需要 API Key，CLI 和浏览器扩展都能直接跑
• 🛠️一条安装流程：/impeccable init会生成PRODUCT.md并推荐DESIGN.md，之后的每条命令都知道你的受众、品牌调性和设计约束
• 🪝设计钩子（Design Hook）：在 Cursor、Claude Code、Codex 等平台上，AI 每次编辑 UI 文件后自动触发检测，把问题实时反馈给模型

完整能力对照见官方文档：docs/HARNESSES.md，贡献者指南见 docs/DEVELOP.md。

5 种安装方式速览：按场景选一种

💡 新手直接选方式①，其他方式都是它的补充。

方式一：CLI 安装器（推荐）——最快配置方法

前提：Node.js ≥ 22.18（见 package.json）。

一键安装步骤

在项目根目录执行：

npx impeccable install

安装器会自动完成四件事：

1. 探测已有的 harness 目录：如~/.claude、~/.codex、~/.grok，或项目本地的.cursor
2. 让你确认或自定义要安装的提供商（Cursor、Claude Code、Codex、Gemini、Grok Build、GitHub Copilot 等）
3. 询问安装范围：当前项目（project）还是全局（global）
4. 安装设计钩子清单：对 Claude Code、Cursor、Codex、GitHub Copilot、Grok Build 写入对应的 hook 配置文件

脚本化安装：跳过交互选项

在 CI 或批量脚本中，用参数直接指定提供商和范围：

npx impeccable install --providers=claude,codex,cursor,grok --scope=project

刷新已有安装只需：

npx impeccable update

📌 不想装钩子？加--no-hooks即可跳过，不会留下任何配置。

三大平台安装要点：Cursor、Claude Code、Codex

安装器是通用的，但每个平台有两个容易踩坑的细节，单独拎出来说。

🖱️ Cursor：记得开两个开关

Cursor 对 Skill 的支持需要手动开启：

1. 进入Cursor Settings → Beta，切换到Nightly 渠道
2. 进入Cursor Settings → Rules，开启Agent Skills

安装后 Skill 落在项目内.cursor/skills/impeccable/，钩子配置在.cursor/hooks.json，会在 AI 的写入落盘前拦截不符合设计规范的内容。如果钩子没生效，保存文件会自动重载，必要时重启 Cursor。

🤖 Claude Code：项目级与全局级

# 项目级（推荐，只对当前项目生效） cp -r dist/claude-code/.claude your-project/ # 全局级（所有项目共用） cp -r dist/claude-code/.claude/* ~/.claude/

Claude Code 的钩子写在.claude/settings.local.json（本机专属、已被 gitignore），编辑完成后自动运行检测并把发现反馈给模型。

📝 Codex：装完记得批准钩子

这是三个平台里唯一必须手动操作一步的：

# 项目本地安装 cp -r dist/agents/.agents your-project/ mkdir -p your-project/.codex cp dist/codex/.codex/hooks.json your-project/.codex/hooks.json

安装或更新后，打开/hooks并批准项目钩子。Codex 按钩子定义做信任追踪，每次更新只要.codex/hooks.json变化，就可能再次要求批准。

三个平台的钩子挂载点对照（源码参考 docs/HARNESSES.md）：

方式二：Git Submodule 安装——团队协作最优解

团队想"把 Impeccable 锁定在项目里、随仓库版本走"？用 submodule：

git submodule add https://gitcode.com/GitHub_Trending/im/impeccable .impeccable npx impeccable link --source=.impeccable --providers=claude,cursor git add .gitmodules .impeccable .claude .cursor git commit -m "Add Impeccable skills"

providers可选值包括：claude、cursor、gemini、codex、github、grok、opencode、pi、qoder、trae、rovo-dev、vibe。后续更新两步走：

git submodule update --remote .impeccable npx impeccable link --source=.impeccable --providers=claude,cursor

方式三：插件市场安装（Claude Code 专属捷径）

/plugin marketplace add pbakaus/impeccable

添加市场后打开/plugin，从列表里安装 Impeccable 即可。Grok Build 用户则用：

grok plugin install pbakaus/impeccable#plugin --trust

装完怎么用？3 条命令上手

安装后重启你的 AI 工具，然后在对话框里：

/impeccable init # 首次必跑：采集设计上下文，生成 PRODUCT.md 和 DESIGN.md /impeccable audit # 跑一轮技术质量检查（可访问性、性能、响应式） /impeccable polish # 上线前最后一遍打磨

大多数命令支持指定范围，比如/impeccable audit the header、/impeccable polish the checkout form。高频命令还能用/impeccable pin audit创建独立快捷方式/audit。

不经过 AI 也能用——独立 CLI 可直接扫描文件、目录甚至线上 URL：

npx impeccable detect src/ # 扫描目录 npx impeccable detect https://example.com # 扫描线上页面 npx impeccable detect --json . # CI 友好的 JSON 输出

规则目录和忽略配置管理入口在 docs/HARNESSES.md 与 package.json 描述的能力矩阵中都有覆盖。

常见问题速查表：安装排错清单

小结：一条命令，全平台设计升级

• 5 分钟：npx impeccable install+ 重启工具 +/impeccable init
• 14 个平台：Cursor、Claude Code、Codex、Gemini CLI、GitHub Copilot、Grok Build、OpenCode、Qoder、Trae 等全覆盖
• 双保险：23 个命令管"怎么改"，59 条检测规则 + 设计钩子管"改得对不对"

装好后跑一次/impeccable audit，看看 AI 生成的页面里藏着多少"模板脸"——大概率会让你想立刻执行下一条polish。

【免费下载链接】impeccableThe design language that makes your AI harness better at design.项目地址: https://gitcode.com/GitHub_Trending/im/impeccable