vault backup: 2026-03-04 00:50:24

2026-03-04 00:50:24 +08:00
parent 2547a60911
commit c815ccb499
2 changed files with 168 additions and 22 deletions
--- a/07-Other/AI/AI
+++ b/07-Other/AI/AI
@@ -5,19 +5,18 @@
 	1. 本地部署 LLM，无订阅使用 Claude Code https://km.netease.com/v4/detail/blog/258409
 		1. 【【硬核教程】教你搭建Mac AI集群！4台M3 Ultra，运行万亿参数大模型！】 https://www.bilibili.com/video/BV18wZjBuEUB/?share_source=copy_web&vd_source=fe8142e8e12816535feaeabd6f6cdc8e
 		2. 【模型推理时所需的GPU显存】 https://www.bilibili.com/video/BV1up25Y7Emb/?share_source=copy_web&vd_source=fe8142e8e12816535feaeabd6f6cdc8e
-	2. ClaudeCode插件
+	2. [ ] ClaudeCode插件
 		1. 【🚀告别Vibe Coding！用Superpowers让Claude Code写出工程级代码，一次通过零报错！遵循TDD最佳实践！支持Codex】 https://www.bilibili.com/video/BV11urFBrEc4/?share_source=copy_web&vd_source=fe8142e8e12816535feaeabd6f6cdc8e
 		2. Ralph for Claude Code：【🚀Claude Code自动化开发必备神器！Ralph for Claude Code实战演示，导入PRD文档秒变任务清单，AI通宵帮你写代码！保姆级教程】 https://www.bilibili.com/video/BV1V9kEB7Erw/?share_source=copy_web&vd_source=fe8142e8e12816535feaeabd6f6cdc8e
-	3. Claude Code Agent Teams 实验与技术剖析 https://km.netease.com/v4/detail/blog/259175
-	4. [Anthropic 黑客马拉松获胜者的完整 Claude Code 配置集合](https://github.com/affaan-m/everything-claude-code/blob/main/README.zh-CN.md)
-	5. [claude.md怎么写才能让Claude Code更高效？](https://www.zhihu.com/question/1979609139266213083/answer/2009919949922133046?share_code=vC8d59XJYGNj&utm_psn=2010698466100262066)
-	6. [他把Claude Code给玩通关了 - 欧巴聊AI的文章 - 知乎](https://zhuanlan.zhihu.com/p/2001805409359520847)
+	3. [ ] Claude Code Agent Teams 实验与技术剖析 https://km.netease.com/v4/detail/blog/259175
+	4. [ ] [Anthropic 黑客马拉松获胜者的完整 Claude Code 配置集合](https://github.com/affaan-m/everything-claude-code/blob/main/README.zh-CN.md)
+	5. [ ] [claude.md怎么写才能让Claude Code更高效？](https://www.zhihu.com/question/1979609139266213083/answer/2009919949922133046?share_code=vC8d59XJYGNj&utm_psn=2010698466100262066)
+	6. [ ] [他把Claude Code给玩通关了 - 欧巴聊AI的文章 - 知乎](https://zhuanlan.zhihu.com/p/2001805409359520847)
 3. 教学视频
 	1. ClaudeCode
-		1. 【Claude Code 从 0 到 1 全攻略：MCP / SubAgent / Agent Skill / Hook / 图片 / 上下文处理/ 后台任务】 https://www.bilibili.com/video/BV14rzQB9EJj/?share_source=copy_web&vd_source=fe8142e8e12816535feaeabd6f6cdc8e
-		2. 【最火AI编程Claude Code详细攻略，一期视频精通】 https://www.bilibili.com/video/BV1XGbazvEuh/?share_source=copy_web&vd_source=fe8142e8e12816535feaeabd6f6cdc8e
-		3. 【测了GLM5配合Agent Teams，我有点emo了】 https://www.bilibili.com/video/BV1GRcezqEZM/?share_source=copy_web&vd_source=fe8142e8e12816535feaeabd6f6cdc8e
-		4. 【AI Max+ 395突破96G显存限制部署GLM-4.7生成电脑游戏】 https://www.bilibili.com/video/BV1pfixBvEzC/?share_source=copy_web&vd_source=fe8142e8e12816535feaeabd6f6cdc8e
+		1. [x] 【Claude Code 从 0 到 1 全攻略：MCP / SubAgent / Agent Skill / Hook / 图片 / 上下文处理/ 后台任务】 https://www.bilibili.com/video/BV14rzQB9EJj/?share_source=copy_web&vd_source=fe8142e8e12816535feaeabd6f6cdc8e
+		2. [x] 【最火AI编程Claude Code详细攻略，一期视频精通】 https://www.bilibili.com/video/BV1XGbazvEuh/?share_source=copy_web&vd_source=fe8142e8e12816535feaeabd6f6cdc8e
+		3. 【AI Max+ 395突破96G显存限制部署GLM-4.7生成电脑游戏】 https://www.bilibili.com/video/BV1pfixBvEzC/?share_source=copy_web&vd_source=fe8142e8e12816535feaeabd6f6cdc8e
 	2. CodeX
 		1. 【AI编程新王Codex详细攻略，一期视频精通，附免费使用方法】 https://www.bilibili.com/video/BV1wm4UzfEbr/?share_source=copy_web&vd_source=fe8142e8e12816535feaeabd6f6cdc8e
 	3. OpenCode
@@ -80,22 +79,161 @@ github:github_pat_11AC3WJDA0uKAykS4HdpuL_XQ1Y7hRe9mwaeCE4cAYEolNjyc8jqid6PMweLMY
 PS. 接入OpenClaw，API格式是基于OpenAI的。

 # ClaudeCode
+- 教学视频
+	- [【Claude Code 从 0 到 1 全攻略：MCP / SubAgent / Agent Skill / Hook / 图片 / 上下文处理/ 后台任务】 https://www.bilibili.com/video/BV14rzQB9EJj/?share_source=copy_web&vd_source=fe8142e8e12816535feaeabd6f6cdc8e
+- 可视化客户端:https://github.com/getAsterisk/claudia
+	- Insight ->  Forks -> xuzhenpeng263 / claudia-globa

+## Claude.md
+ClaudeCode每次启动都会读取这个文件。
+
+### 🤔 为什么你需要一个 `CLAUDE.md` 文件？
+Claude 每次对话都是独立的，没有项目记忆。`CLAUDE.md` 解决了这个问题，它会在每次会话开始时自动加载，告诉 Claude 关于你项目的一切，让你无需重复说明项目背景、代码风格或常用命令。
+**编写优秀 `CLAUDE.md` 的核心原则：**
+- **简洁为王，保持精悍**：Claude的上下文窗口是宝贵的资源。文件应尽量精炼，最好控制在300行以内，确保每一条信息都不可或缺。
+- **具体明确，拒绝模糊**：指令要清晰、可操作。不要说“代码写得好一点”，而要规定“使用ES模块，推崇命名导出，变量命名采用驼峰式”这样的具体规则。
+- **持续进化，动态更新**：这不是一份写完就固定的文档。在开发过程中，如果发现 Claude 的某些做法不符合预期，可以随时让它“更新 `CLAUDE.md`：以后都使用日志库替代 `console.log`”。通过这种持续迭代，让文件成为项目活的规范。
+- **善用引用，分层管理**：对于庞大的项目，可以将通用规则放在根目录的 `CLAUDE.md` 中，而将特定模块的细节（如API设计模式）拆分到单独的文件里，再用 `@docs/api-patterns.md` 的方式引入。此外，`.claude/rules/` 目录和子目录下的 `CLAUDE.md` 文件也是实现模块化、按需加载的好方法。
+
+### 🚀 优秀 `CLAUDE.md` 方案与实战案例
+基于以上原则，这里为你提供一套可以直接套用的编写方案和几个不同场景的案例。
+
+#### 基础通用模板
+这个模板涵盖了大多数项目需要的基本信息，你可以根据自己的项目进行填充。
+```markdown
+# 项目： [项目名称]
+
+一句话描述项目：这是一个[项目类型]应用，使用了[核心技术栈]和[关键集成服务]。
+
+## 代码风格与规范
+
+- **语言与框架**：[例如：TypeScript 严格模式，Next.js 14 App Router]
+- **命名规则**：[例如：组件使用 PascalCase，工具函数使用 camelCase，样式类使用 kebab-case]
+- **导入导出**：[例如：统一使用命名导出 (named export)，避免默认导出 (default export)]
+- **样式方案**：[例如：使用 TailwindCSS 工具类，禁止编写自定义 CSS 文件]
+- **错误处理**：[例如：必须使用 try-catch 包裹异步操作，错误信息需记录到 Sentry]
+
+## 重要命令
+
+- `npm run dev`：启动开发服务器（端口 3000）
+- `npm run build`：构建生产版本
+- `npm run test`：运行单元测试 (Jest)
+- `npm run lint`：运行代码检查 (ESLint)
+- `npm run db:migrate`：执行数据库迁移
+
+## 项目架构与重要约定
+
+- `/app`：Next.js 路由和页面
+- `/components/ui`：可复用的UI组件库
+- `/lib`：工具函数和共享逻辑
+- `/prisma`：数据库Schema和迁移文件
+- **重要**：`/app/api/webhooks/stripe` 文件中的签名验证逻辑**严禁修改**
+- **禁止**：将 `.env` 文件提交到代码仓库
+```
+
+#### 分层文件结构方案（适合大型项目）
+当项目变得庞大时，单一文件会变得臃肿。可以采用分层结构，让 Claude 在不同目录下工作时，只加载最相关的规则。
+```text
+your-project/
+├── CLAUDE.md                # 全局规则：Git工作流、通用命令
+├── .claude/
+│   └── rules/
+│       ├── testing.md       # 测试规范，被根目录CLAUDE.md引用
+│       └── security.md      # 安全规范
+├── backend/
+│   └── CLAUDE.md            # 后端专属规则：Python/FastAPI 风格、数据库操作
+└── frontend/
+    └── CLAUDE.md            # 前端专属规则：React/TypeScript 组件规范、状态管理
+```
+
+#### 案例一：Next.js 电商项目
+这个案例来自 Builder.io 的博客，清晰地展示了如何为一个具体的 Next.js 电商项目编写指令。
+```markdown
+# Project: ShopFront
+
+Next.js 14 e-commerce application with App Router, Stripe payments, and Prisma ORM.
+
+## Code Style
+
+- TypeScript strict mode, no `any` types
+- Use named exports, not default exports
+- CSS: Tailwind utility classes, no custom CSS files
+
+## Commands
+
+- `npm run dev`: Start development server (port 3000)
+- `npm run test`: Run Jest tests
+- `npm run test:e2e`: Run Playwright end-to-end tests
+- `npm run lint`: ESLint check
+- `npm run db:migrate`: Run Prisma migrations
+
+## Architecture
+
+- `/app`: Next.js App Router pages and layouts
+- `/components/ui`: Reusable UI components
+- `/lib`: Utilities and shared logic
+- `/prisma`: Database schema and migrations
+- `/app/api`: API routes
+
+## Important Notes
+
+- NEVER commit .env files
+- The Stripe webhook handler in /app/api/webhooks/stripe must validate signatures
+- Product images are stored in Cloudinary, not locally
+- See @docs/authentication.md for auth flow details
+```
+
+#### 案例二：集成外部工具的支持调查员（Mergify 实战）
+这个案例来自 Mergify 公司，展示了 `CLAUDE.md` 如何超越代码规范，成为一个复杂工作流的“大脑”。他们将技术支持手册编码进文件，让 Claude 能并行调查来自 Sentry、Datadog 和数据库的线索，将平均处理时间从15分钟锐减到5分钟以内。
+```markdown
+# Support Investigation Agent
+
+You are an expert support engineer for Mergify. Your goal is to investigate customer tickets by gathering evidence from multiple systems in parallel.
+
+## Investigation Workflow (Execute Steps in Parallel)
+
+1.  **Identify Context**: Extract `organization`, `repository`, and `PR number` from the ticket URL (fetched via Plain MCP).
+2.  **Launch Parallel Investigations (Wave 1)**:
+    - **Database Query (Read-Only)**: Use `/pr-event-log` slash command to get event timeline for the PR.
+    - **Error Tracking**: Search Sentry (via MCP) for errors related to the customer org and timeframe.
+    - **Logs**: Query Datadog (via MCP) for relevant log spikes.
+    - **Existing Tickets**: Search Linear (via MCP) for related, unresolved issues.
+3.  **Synthesize Findings**: Merge results from all sources into a unified timeline.
+4.  **Generate Output**: Draft a response with findings, hypothesis, and suggested next steps. If a new bug is confirmed, create a Linear ticket draft with a fix plan.
+
+## Important Constraints
+
+- All database queries MUST include a `LIMIT` clause and time filter.
+- Never assume causality; present findings as correlations for the engineer to review.
+- If the investigation involves engine code, inspect it under the `src/` directory.
+- Check GitHub status for ongoing incidents if widespread failures are suspected.
+```
+
+### 💡 高级技巧与避坑指南
+- **`/init` 命令是你的好帮手**：在新项目中，首先运行 `/init` 命令。Claude 会自动扫描你的项目结构、依赖和文档，生成一个不错的 `CLAUDE.md` 基础版本，你可以在这个基础上修改，比自己从零开始写要快得多。
+- **用 @ 精确引用信息**：在 `CLAUDE.md` 中，你可以使用 `@` 符号引用其他文件，如 `@README.md` 或 `@docs/api-spec.md`。Claude 在需要时会自动读取这些文件的内容，这有助于保持主文件的简洁，同时又能提供深度信息。
+- **区分团队共享与个人偏好**：将团队共有的规范放在项目内的 `CLAUDE.md` 中并提交至 Git。而个人的、无需共享的偏好（如最喜欢的 Pizza 口味、个人笔记），可以放在 `CLAUDE.local.md` 或通过 `@~/.claude/info.md` 引用，并确保这些文件被 Git 忽略。
+- **通过代码审查持续改进**：当同事在代码审查中指出一个未文档化的约定或错误时，这就是更新 `CLAUDE.md` 的最佳时机。甚至可以直接在 PR 评论中 @Claude，让它根据评论自动更新文件，形成“发现问题 -> 更新规则 -> 预防未来问题”的良性循环。
+- **避免“过度承诺”**：不要在文件中堆砌无用的套话，每一条指令都应该有它存在的价值。像“请编写高质量的代码”这种模糊指令可以删掉，它们只会稀释真正重要的信息。
 ## 操作命令
-1. /init：扫描项目所有代码，并且记录上下文到claude.md。后续用户可以自己在里面补充相关信息。
-2. /compact：压缩上下文。提高AI专注度并且可以节约token。
-3. /clear：清楚上下文。一般在新任务开启时使用。
+1. /init：扫描项目所有代码，并且记录上下文到**claude.md**。后续用户可以自己在里面补充相关信息。
+2. **/compact**：压缩上下文。提高AI专注度并且可以节约token。 可以输入压缩策略，比如：重点保留用户需求。
+3. **/clear**：清楚上下文。一般在新任务开启时使用。
 	1. 控制AI思考时间的关键词 think < think hard < think harder < ultrathink 
-4. /rewind 或者 按2下ESC：回滚这一步操作。
-5. /tasks：查看后台任务。
-6. ! 临时执行命令行。
-7. # 向claude说明相关知识。
-8. 在命令行中开启危险模式**输入：** `/permission` 或 `/config` 在弹出的设置菜单中，寻找 **"Auto-approve safe commands"** 或 **"Full Auto-approve"** 选项并开启。
-9. 启动危险模式：claude --dangerously-skip-permissions；执行完某个Prompt后退出：claude -p "运行测试并修复报错" --dangerously-skip-permissions
-10. 切换模型：
+4. **/resume**：回到上一个对话。
+5. **/skills**：在项目目录下新建Skills文件夹，在里面添加Skill。
+	1. 可以输出/SkillName，主动让ClaudeCode调用指定Skill。
+6. **/ide**：可以打通ClaudeCode与对应IDE。
+7. /rewind 或者 按2下ESC：回滚这一步操作。
+8. /tasks：查看后台任务。
+9. ! 临时执行命令行。
+10. # 向claude说明相关知识。
+11. 在命令行中开启危险模式**输入：** `/permission` 或 `/config` 在弹出的设置菜单中，寻找 **"Auto-approve safe commands"** 或 **"Full Auto-approve"** 选项并开启。
+12. 启动危险模式：claude --dangerously-skip-permissions；执行完某个Prompt后退出：claude -p "运行测试并修复报错" --dangerously-skip-permissions
+13. 切换模型：
 	1. claude --model claude-opus-4-6
 	2. claude --model glm-4.7-flash:q8_0
-11. 永久修改模型设置:claude config set -g model claude-opus-4-6
+14. 永久修改模型设置:claude config set -g model claude-opus-4-6

 ## Hook
 当用户做到某项操作后自动执行某项命令。
@@ -118,11 +256,17 @@ Common
 - Write

 ## SubAgent
+用于哪些与主Agent上下文关系不大的任务。
+- 提示词
+	- 这是一个用于代码审核的 SubAgent。在用户要求“代码审核”的时候调用它。
+

 ## 历史对话
 - RonitSachdev/CCUndo：回退对话并且回退代码。
 # Plugin
-使用/plugin来进行安装。推荐插件：
+用于将一系列的Skill、SubAgent、Hook等能力都打包到一起，你只需要一键安装即可。
+使用/plugin来进行安装，通过find来寻找插件。
+推荐插件：
 - Context7

 # 其他相关知识
--- a/Agent/ClaudeCode/ClaudeCode联动Figma.md
+++ b/Agent/ClaudeCode/ClaudeCode联动Figma.md
@@ -2,4 +2,6 @@
 1. developers.figma.com/docs/figma-mcp-server/remote-server-installation/#claude-code

 # 步骤
-1. 添加Figma MCP: claude mcp add --transport http figmahttps://mcp.figma.com/mcp
+1. 添加Figma MCP: claude mcp add --transport http figmahttps://mcp.figma.com/mcp。
+2. 执行/mcp 之后选择Figma -> Authenticate，在登录后再次选择/mcp 之后选择Figma。
+3. 向ClaudeCode输入 修改当前页面，使它与figma稿件保持一致。