Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
직접 명령은 검토 Prompt를 거치지 않습니다. 실행하기 전에 소스를 확인하세요.
npx skills add https://github.com/TencentBlueKing/bk-bcs --skill magicbox-30명령은 한 줄로 유지됩니다. 복사하기 전에 가로로 스크롤해 전체 내용을 확인하세요.
로컬 사본을 원하시나요? SkillsMP에서 현재 제공할 수 있는 파일을 다운로드하세요.
SOC 직업 분류 기준
SKILL.md 표시 중
| id | engineering/bkui-builder |
| name | 蓝鲸 MagicBox 3.0 组件专家规则 |
| category | engineering |
| description | 设计稿还原规则。先输出布局分析报告,再按需加载模版 |
| tags | ["vue3","bkui-vue","rules","template","expert"] |
| updated_at | 2026-01-19T00:00:00.000Z |
div 自创 sidebar/header/menu<bk-navigation><table>, <button>,必须用 bk-table, bk-buttonStep 1: 分析设计稿 - 判断:主题深/浅色?表格/表单页?菜单有图标?
Step 2: 加载模版 (FetchMcpResource, server: user-BKUI-Knowledge)
| 判断结果 | URI |
|---|---|
| 深色侧边栏 | skill://bkui-builder/assets/layouts/admin-layout-dark.vue |
| 浅色侧边栏 | skill://bkui-builder/assets/layouts/admin-layout-left.vue |
| 表格页+Tab | skill://bkui-builder/assets/pages/table-page.vue |
| 有图标 | skill://bkui-builder/references/visual-mapping.md |
Step 3: 参考模版生成代码
<bk-navigation navigation-type="left-right" need-menu default-open>
<template #menu>
<bk-menu :active-key="activeMenu" :opened-keys="['group-1']">
<bk-menu-item key="home">首页</bk-menu-item>
</bk-menu>
</template>
</bk-navigation>
⚠️ 属性名是
opened-keys,不是default-open-keys
// ✅ 正确
import { Search, Plus, Close } from 'bkui-vue/lib/icon';
// ❌ 错误: import { Search } from '@bkui-vue/icon';
skill://bkui-builder/references/code-snippets.md - 代码片段skill://bkui-builder/references/checklist.md - 质量检查skill://bkui-builder/references/checklist.mdskill://bkui-builder/references/code-snippets.mdskill://bkui-builder/references/visual-mapping.mdskill://bkui-builder/assets/layouts/admin-layout-dark.vueskill://bkui-builder/assets/layouts/admin-layout-left.vueskill://bkui-builder/assets/layouts/admin-layout-top.vueskill://bkui-builder/assets/pages/dashboard-page.vueskill://bkui-builder/assets/pages/detail-page.vueskill://bkui-builder/assets/pages/table-page.vueskill://bkui-builder/assets/pages/wizard-form.vue根据 SKILL.md 中的 IF-THEN 规则判断是否需要加载