claude很强大， 但是我们使用它的时候必须掌握一定的技巧，2025年12月18日，claude将agent skills作为一种跨平台可移植的开放标准发布。

# 什么是skills
简单来说，skills就是一个markdown文件，里面存放了做一件事情的要求，当claude加载的时候，默认将其加载在系统提示词中，这样就相当于给claude赋予了一种明确的技能

![image.png](/static/img/25f0b65d590fb0b2d633972d482d7f9c.image.webp)

# 解析skills
我们在讨论使用claude的时候，会提到需要思考好明确的步骤让claude执行，skills也是，所以skills需要如下特征
* 解决一个具体且可重复的任务
* 给claude能遵守的明确指示
* 最好提供示例
* 定义何时使用这些信息
* 专注于一个工作流程，而不是试图做所有事情

换句话说，将上述特征点写成一个markdown给claude当作skills来加载，那么这个markdown就是skill。skill的组成如下

![image.png](/static/img/a586b5677b45bd11e62b774c8e37f772.image.webp)

我们可以把一个skill.md分成如下三大内容
* name： 一个描述skill的简短名字  (yaml格式)
* description： 明确说明该技能的作用以及何时使用   (yaml格式)
* markdown context： 一个skill的详细描述

其中，name和description会一直被加载到claude中，也就是如果skill的description越大，消耗的token就越多

而markdown的内容就是具体让claude执行的步骤书。 一个最简单的skill示例如下
```
## Metadata
name：品牌指南  
description：将 Acme Corp 品牌指南应用于所有演示文稿和文档

## 概述
此 Skill 提供 Acme Corp 官方品牌指南，用于创建一致、专业的企业材料。在制作演示文稿、文档或营销材料时，请严格应用这些标准，确保所有输出均符合 Acme 的视觉识别系统。Claude 在创建面向外部的材料或代表 Acme Corp 的文档时，应始终参考本指南。

## 品牌色彩

我们的官方品牌色彩为：
- **主色**：#FF6B35（珊瑚橙 / Coral）
- **辅助色**：#004E89（海军蓝 / Navy Blue）
- **强调色**：#F7B801（金色 / Gold）
- **中性色**：#2E2E2E（炭灰 / Charcoal）

## 字体规范

- **标题字体**：Montserrat Bold  
- **正文字体**：Open Sans Regular  

**字号指南**：
- H1：32pt  
- H2：24pt  
- 正文：11pt

## Logo 使用规范

- 浅色背景时，必须使用全彩 Logo；  
- 深色背景时，必须使用白色 Logo；  
- Logo 周围需保留至少 0.5 英寸（约 1.27 cm）的安全距离。

## 适用场景

在以下情况时必须应用本品牌指南：
- PowerPoint 演示文稿
- 对外分享的 Word 文档
- 营销材料
- 客户报告

## 资源

请查看 resources 文件夹，获取 Logo 文件和字体下载链接。
```
这样，当和claude对话的时候，如果出现`将 Acme Corp 品牌指南应用于所有演示文稿和文档`这段字的注意力和用户提示词的注意力匹配，那么就会主动调用这个名字为`品牌指南`的skill，这样，整个skill.md描述的所有文本就会被加载。会输出按照要求的ppt/work等相关材料和报告


# 调用skills
所谓调用skill其实就是claude识别到了关键字，这个关键字就是skill的description所描述的关键字，然后再利用markdown的步骤执行。所以其步骤如下
* 对话窗口包含对应技能的核心系统提示词
* 命中提示词后，claude读取对应.claude目录的name/skill.md
* 直接阅读skill.md的markdown部分，如果有ref，则读取引用部分，如果有res，则读取资源部分，如果有script，则运行脚本
* 最后根据skill的描述，继续执行用户的任务

![image.png](/static/img/7cc41d9b06f7bec4660159719b14da87.image.webp)



# skills执行工具
skill和mcp一样，skill本身就可以运行脚本，只需要我们在skill.md中描述了执行步骤，方式如下

![image.png](/static/img/655b97f91712c74add5b6bc3dee192ec.image.webp)

# 演示
为了演示skill，我们可以先安装一个基本的skill，就是创建skill的skill。
方法有很多种，其本质是将skill的那个文件/文件夹放到本地claude能读取的目录。有两种
1. 全局目录：~/.claude/
2. 项目目录：~/project/.claude/

也可以通过命令安装
```
npx skills add https://github.com/anthropics/skills --skill skill-creator
```
或
```
claude install anthropics/skills/skill-creator
```
安装完成只会可以看到这个安装的skill
```
❯ /skills

─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
  Skills
  1 skills

  User skills (skills)
  skill-creator · ~83 description tokens
```
下面让其给我做一个简单的skill
```
 > 给我做一个skill，获取今日黄历查询，弹框形式告诉我今日宜忌
```
skill-ctreator会先尝试理解需求，对你提问
```
←  ☐ 数据来源  ☐ 弹框样式  ✔ Submit  →

黄历数据从哪里获取？（API、内置数据、还是网页抓取）

❯ 1. API接口
     调用聚合数据/黄历API获取今日宜忌
  2. 内置数据
     内置一个基础黄历数据（公历2026年对应农历）
  3. 网页抓取
     从网页爬取当日黄历信息
  4. Type something.(自行选用最优方法)
──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
  5. Chat about this
```
这里我可以选中4，让他自己选择,然后提交即可
```
←  ☒ 数据来源  ☒ 弹框样式  ✔ Submit  →

Review your answers

 ● 黄历数据从哪里获取？（API、内置数据、还是网页抓取）
   → 自行选用最优方法
 ● 弹框展示方式用哪种？
   → 系统弹框 (Recommended)

Ready to submit your answers?

❯ 1. Submit answers
  2. Cancel
```
等待2分钟，这个skill就完成了
```
● Skill创建完成！

  今日黄历查询 Skill 已创建

  位置: ~/.claude/skills/daily-huangli/

  结构:
  daily-huangli/
  ├── SKILL.md          # Skill说明文件
  └── scripts/
      └── huangli.py    # 黄历查询脚本

  功能:
  - 获取今日黄历宜忌信息
  - 以系统弹框形式展示（支持Linux notify-send、macOS对话框、终端回退）
  - 内置2026年黄历数据

  触发方式:
  - 对我说 "今日黄历" / "今天宜忌" / "查询黄历" 等

  测试结果:
  2026年03月29日  农历三月廿九

  【今日宜】
  祭祀  祈福  求嗣  开光  解除  拆卸

  【今日忌】
  开市 立券 交易 行丧 安葬
```
使用这个skill
```
❯ 查询今日黄历

● 今日黄历查询结果：

  2026年03月29日  农历三月廿九

  ┌────────────────────────────────────┬──────────────────────────────┐
  │                 宜                 │              忌              │
  ├────────────────────────────────────┼──────────────────────────────┤
  │ 祭祀  祈福  求嗣  开光  解除  拆卸 │ 开市  立券  交易  行丧  安葬 │
  └────────────────────────────────────┴──────────────────────────────┘
```
# SKILL内容
现在让我们看一下这个skill的组成
````markdown
---
name: daily-huangli
description: 获取今日黄历查询，以系统弹框形式展示今日宜忌。Use this skill whenever user asks about Chinese calendar, 黄历, 今日宜忌, 宜忌, 吉凶, 运程, or wants to know what activities are auspicious or inauspicious for today.
---

# 今日黄历查询

获取当日黄历信息并以系统弹框形式展示宜忌事项。

## 执行步骤

### 1. 获取今日日期
```bash
date "+%Y-%m-%d"
```

### 2. 调用黄历API获取数据

使用 hlapi.cn 的免费API获取今日黄历：

```bash
curl -s "https://www.hlapi.cn/api/yinli/?date=$(date +%Y-%m-%d)"
```

如果上述API不可用，尝试备用方案：

```bash
curl -s "https://api.xingzhige.com/API/huangli/?date=$(date +%Y%m%d)"
```

### 3. 解析返回数据

从API响应中提取：
- 农历日期（年、月、日）
- 宜（auspicious activities）
- 忌（inauspicious activities）
- 吉神/凶神
- 冲/煞等神煞信息

### 4. 格式化输出

整理为宜忌列表格式：

```
【今日黄历】2026年3月29日 农历三月初一

宜：祭祀 开光 祈福 订盟 订婚...
忌：动土 破土 掘井...

吉神方位：甲方
凶神方位：坤方
冲煞：冲鼠(壬子) 煞北
```

### 5. 显示系统弹框

使用系统通知方式展示：

**Linux (notify-send):**
```bash
notify-send "今日黄历" "$(echo -e '宜：${yi}\n忌：${ji}')" --icon=calendar
```

**macOS (osascript):**
```bash
osascript -e 'display dialog "今日黄历\n\n宜：\n${yi}\n\n忌：\n${ji}" with title "今日黄历" buttons {"确定"} default button "确定"'
```

**通用Python方案（支持跨平台）:**
```python
import subprocess
import sys

message = f"""今日黄历

宜：{yi}

忌：{ji}

{ganzhi} {shengxiao}日
{festival_info}"""

# 尝试不同平台的通知方式
try:
    subprocess.run(['notify-send', '今日黄历', message], check=True)
except (FileNotFoundError, subprocess.CalledProcessError):
    try:
        subprocess.run(['osascript', '-e', f'display dialog "{message}" with title "今日黄历" buttons {"确定"} default button "确定"'], check=True)
    except:
        print(message)  # 回退到终端输出
```

## 完整执行脚本

如需更稳定的体验，可使用以下Python脚本：

```python
#!/usr/bin/env python3
import requests
import subprocess
import sys
from datetime import datetime

def get_huangli():
    today = datetime.now().strftime('%Y-%m-%d')

    # 尝试多个API源
    apis = [
        f"https://www.hlapi.cn/api/yinli/?date={today}",
    ]

    for api in apis:
        try:
            resp = requests.get(api, timeout=5)
            if resp.status_code == 200:
                data = resp.json()
                return data
        except:
            continue

    return None

def show_notification(huangli_data):
    if not huangli_data:
        message = "无法获取今日黄历数据"
    else:
        try:
            # 解析数据 - 根据实际API返回格式调整
            data = huangli_data
            # 提取宜忌信息
            yi = data.get('data', {}).get('yi', ['无数据']) if isinstance(data.get('data'), dict) else ['无数据']
            ji = data.get('data', {}).get('ji', ['无数据']) if isinstance(data.get('data'), dict) else ['无数据']

            yi_str = ' '.join(yi) if isinstance(yi, list) else str(yi)
            ji_str = ' '.join(ji) if isinstance(ji, list) else str(ji)

            message = f"宜：{yi_str}\n\n忌：{ji_str}"
        except:
            message = "数据解析失败"

    # 尝试系统通知
    try:
        subprocess.run(['notify-send', '-i', 'calendar', '今日黄历', message],
                      check=True, capture_output=True)
        return True
    except:
        pass

    try:
        subprocess.run(['osascript', '-e',
                      f'display dialog "{message}" with title "今日黄历" buttons {{"确定"}} default button "确定"'],
                      check=True, capture_output=True)
        return True
    except:
        pass
    # 回退到打印
    print("=" * 40)
    print("今日黄历")
    print("=" * 40)
    print(message)
    return False

if __name__ == '__main__':
    data = get_huangli()
    show_notification(data)
```

## 注意事项

1. 如果系统通知不可用，会回退到终端输出
2. 确保网络畅通以访问API
3. 部分API可能有访问限制

## 触发场景

当用户询问以下内容时使用此skill：
- "今日黄历"
- "今天宜忌"
- "今日运势"
- "黄历查询"
- "今天有什么忌"
- "今天适合做什么"
````

## 分析
首先我们看description，只要命中了 `黄历, 今日宜忌, 宜忌, 吉凶, 运程` 就会加载这个skill
其次通过markdown的内容， 对我的需求进行了详细的步骤拆解，我们可以review这些拆解是否符合预期。

# 参考
> https://claude.com/blog/equipping-agents-for-the-real-world-with-agent-skills  
> https://support.claude.com/en/articles/12512176-what-are-skills  
> https://support.claude.com/en/articles/12512198-how-to-create-custom-skills  

AI使用指南(5)-介绍agent skills

上一篇文章介绍了plan模式的基本使用办法，相比于基本模式，plan能够先通过对话的方式提供你计划书，然后我们再基于计划书进行审核，如果没问题，执行就行。

为了更好的使用claude，还有一种更好的思维方式，那就是 谋定而后动。 这种方式不局限于plan模式还是基本模式，而是我们想要解决问题的时候的所有方式。

# 思考->规划->行动
所谓谋定而后动，也就意味着我们做任何偏复杂的事情的时候，需要先思考清楚步骤。
* 先想清楚要什么：目标
* 再想办法拆解问题：行动

要做到这个目的，思维模式就需要发生变更，假设我想要使用claude帮你分析和解决一个问题
大多数人对claude的提问可能为如下：
> 我提供你一份日志在xxxx，请你帮我解析错误日志，找出其中的错误，并提供分析报告

如果我们将上述问题拆解，如下提问
> 将存放在xxx的日志解析为结构化数据  
> 为解析的日志条目聚合到统计信息中  
> 分析统计信息，检测存在异常的状态  
> 将统计的数据和警报格式化为可读的报告

看到区别了没有，对于拆解和未拆解的提示描述，拆解的描述思考了每一步如何做，而未拆解的提示词只表达了自己的基本诉求。

所以说，思考->行动，也就意味着我们要更早做出高层次决策：使用什么技术，项目结构如何，每个功能应该放在哪里，文件应该放哪些文件。尽早做出正确决定非常重要。

# 原理
claude在处理用户提示词的时候，有一个注意力的概念，一句话提问，claude很难从一句话中获取`解析 + 统计 + 检测 + 输出`四个关注点，甚至很有可能claude会直接忽略了这些本应该注意到的关注点。

最终无论claude是否注意到这些关注点，它也只会分配很少的能力来处理这些注意力，也就导致每个部分都只做到"刚好能用"。

而拆解后，claude看到的每个子问题，所以自然会在每个子问题中获取全部注意力。例如
- 单独要求"分析信息"时，Claude 会投入精力专注分析缺陷，找到问题
- 单独要求"输出报告"时，Claude 会投入精力提供优秀的报告文章

# 总结
绝大部分时候，claude可以认为是一个很强力的大脑，但它并不是无所不能的神仙，也不是大家肚子里面的蛔虫。如何使用好这个大脑是本文核心想表达的

当我们想要claude给我们解决一个问题，如果我们只提出问题，提出目标，claude可能并没有很好的帮你完成这个问题，你会觉得它也不过如此

如果你提前思考，将解决这个问题的思路，步骤想清楚。然后提供给claude这个无所不能的大脑，让大脑发挥大脑该做的事情，你会发现新大陆。

无plan模式
* 思考：人
* 规划：人
* 行动：AI

plan模式
* 思考：人
* 规划：AI
* 行动：AI

后面我会介绍另一个有用的技巧，那么我们可以做到
* 思考：AI
* 规划：AI
* 行动：AI

# 演示
下面直接让claude自身举证上述技巧。

---

以Nginx 日志分析器为例，让claude用 "一次性给完整需求" 和 "拆成 4 个子问题逐步解决" 两种方式让 Claude 实现。拆解后的代码在覆盖率、可维护性、输出质量上全面领先。


## 测试设计

### 问题

> 用 Python 实现一个 Nginx 日志分析器：解析 access log，统计 Top IP，检测异常流量，生成报告。

### 两种方式

| | 方式 A：单次提问 | 方式 B：拆解子问题 |
|---|---|---|
| **Prompt** | "Write a Python script that parses Nginx access logs, finds top 10 visitor IPs, detects brute-force login attempts, and prints a summary report." | 4 个子问题（见下文） |
| **轮次** | 1 轮 | 4 轮 |

**方式 B 的 4 个子问题：**

1. "Parse a single Nginx log line into a structured dataclass"
2. "Aggregate parsed entries into statistics (IP counts, status codes, path counts)"
3. "Detect anomalous patterns: brute-force, path scanning, high error rate"
4. "Format statistics and alerts into a readable report"

### 测试数据

610 条日志，包含：
- 500 条正常流量（8 个 IP 随机访问 8 个路径）
- 30 条暴力破解（`45.33.32.156` POST `/login`，全部 401）
- 80 条路径扫描（`185.220.101.1` 访问 80 个不同路径，全部 404）

---

## 运行结果对比
### 方式 A 输出

```
=== Log Analysis Report ===
Total requests: 610

Top 10 IPs:
  185.220.101.1: 80 requests
  5.6.7.8: 71 requests
  ...

Status codes:
  200: 337
  404: 126
  ...

Suspicious IPs (>10 login attempts):
  45.33.32.156: 30 login attempts
```

### 方式 B 输出

```
               LOG ANALYSIS REPORT
──────────────────────────────────────────────────
Total requests : 610
Total bytes    : 13,022,437
Parse errors   : 0

Top 10 IPs:
  185.220.101.1              80 ( 13.1%)
  5.6.7.8                    71 ( 11.6%)
  ...

Status code distribution:
  200       337  ██████████████████████
  301        35  ██
  ...

Top 10 paths:
  /                                              75
  /api/products                                  71
  ...

──────────────────────────────────────────────────
ALERTS (4)
──────────────────────────────────────────────────
  🔴 [CRITICAL] 45.33.32.156
     Possible brute-force attack: 30 requests to auth endpoints
  🟡 [WARNING] 185.220.101.1
     Possible path/vulnerability scan: 80 distinct paths accessed
  🟡 [WARNING] 185.220.101.1
     High error rate: 80/80 requests returned 4xx/5xx (100%)
  🟡 [WARNING] 45.33.32.156
     High error rate: 30/30 requests returned 4xx/5xx (100%)
```

---

## 逐项对比

### 1. 功能覆盖度

| 功能 | A（单次） | B（拆解） |
|------|:---------:|:---------:|
| 解析 IP、method、path、status | ✅ | ✅ |
| 解析 User-Agent、Referrer | ❌ | ✅ |
| 解析字节数 / 总流量 | ❌ | ✅ |
| 统计 Top IP | ✅ | ✅（带百分比）|
| 统计 Top path | ❌ | ✅ |
| 状态码分布 | ✅（纯数字）| ✅（带可视化柱状图）|
| 检测暴力破解 | ✅（仅 `/login`） | ✅（多个 auth 端点） |
| 检测路径扫描 | ❌ | ✅ |
| 检测高错误率 IP | ❌ | ✅ |
| 告警分级（critical/warning）| ❌ | ✅ |
| 报告解析错误数 | ❌ | ✅ |

**结论：方式 A 检测到 1 种威胁，方式 B 检测到 3 种。**

### 2. 代码结构
| 指标 | A（单次） | B（拆解） |
|------|-----------|-----------|
| 代码行数 | 45 行 | 160 行 |
| 函数数量 | 1 个（`analyze_logs`） | 5 个（parse → aggregate → detect → format → compose）|
| 数据结构 | 裸 dict + Counter | dataclass（`LogEntry`, `Stats`, `Alert`）|
| 类型标注 | 无 | 完整 |
| 可测试性 | 需要模拟文件 I/O | 每个函数可独立单元测试 |
| 耦合度 | 解析、统计、输出混在一起 | 每层只依赖上一层的输出 |

### 3. 鲁棒性

| 场景 | A | B |
|------|---|---|
| 格式不匹配的日志行 | 静默跳过，无感知 | 计数 `parse_errors`，报告中可见 |
| 只检查 `/login` | 绕过则漏检 | 检查 4 个常见 auth 路径 |
| IPv6 日志 | 正则不匹配，跳过 | 同样不匹配，但至少报告了错误数 |
| 阈值调整 | 硬编码 `> 10` | 函数参数，可配置 |

### 4. 输出可读性

方式 A 的输出是纯文本列表，适合 debug。

方式 B 的输出有：
- 对齐的表格格式
- 百分比标注
- 可视化柱状图（`████`）
- 告警分级图标（🔴🟡）
- 分隔线和标题

---


AI使用指南(4)-先思考后行动

上一篇文章介绍了一些简单的使用技巧，本文演示一下基本功能和一个很好用的Plan功能。
# 基本功能
当我们claude登入后，直接和它对话即可，这就是claude的基本功能。和所有的AI工具一致
```
❯ 你好，什么是贪吃蛇游戏

● 贪吃蛇（Snake）是一款经典的电子游戏：

  - 玩法：玩家控制一条蛇在屏幕上移动，吃掉食物后蛇身变长
  - 目标：尽可能吃更多食物，获得更高分数
  - 游戏结束条件：蛇撞到墙壁或撞到自己的身体
  - 操作：通常用方向键（上下左右）控制移动方向

  这是一款简单但上手容易、极具挑战性的益智游戏，最早出现在1970年代，诺基亚手机版本（1998年）使其广为人知。

```
# Plan模式
我们是不是经常会遇到这样的情况：

和AI沟通的时候，要么自己表述有问题，没有清晰的把自己的需求说出来，要么AI理解有问题，没有理解你的表述

在这两种情况下，如果按照基本模式去工作，很容易让claude直接按照错误的意思干活去了，这导致claude干了不是你意思的活。导致你要么需要clear重新来，要么rewind重新问。

Plan模式就是解决这种困境的。

Plan mode让你和Claude提前对话，让它尝试理解你的意思，在理解完成之后，给出包含你意思的计划书。当你认为这个计划书没问题的时候，你可以让他按照这个计划书来干活。这样的好处就是，claude不会提前干活，且你能够很精确的确保claude干的活符合你的需求(因为你会检查计划书)。

下面开始演示
两种方式启动plan mode
* `/plan` 直接启动
* `shift + tab` 快捷键选中到plan mode

成功之后显示如下
```
  ⏸ plan mode on (shift+tab to cycle)                                                               ◐ medium · /effort
╭─── Claude Code v2.1.63 ───────────────────────────────────────────────────────────────────────────────────────────╮
│                                               │ Tips for getting started                                          │
│                 Welcome back!                 │ Run /init to create a CLAUDE.md file with instructions for Claude │
│                                               │ ───────────────────────────────────────────────────────────────── │
│                    ▐▛███▜▌                    │ Recent activity                                                   │
│                   ▝▜█████▛▘                   │ No recent activity                                                │
│                     ▘▘ ▝▝                     │                                                                   │
│                                               │                                                                   │
│   Sonnet 4.6 · Claude Pro                      │                                                                   │
│                 ~/                  │                                                                   │
╰───────────────────────────────────────────────────────────────────────────────────────────────────────────────────╯
```
可以看到plan mode开启成功了，接下来我们对话，让它开发一个贪吃蛇小游戏，它不会直接开始干，而是理解你的需求，提供一份计划书，如下
```
╭──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╮
│ Plan to implement                                                                                                    │
│                                                                                                                      │
│ 网页贪吃蛇游戏开发计划                                                                                               │
│                                                                                                                      │
│ Context                                                                                                              │
│                                                                                                                      │
│ 用户需要一个网页版贪吃蛇游戏，通过键盘上下左右方向键控制蛇的移动。                                                   │
│                                                                                                                      │
│ 实现方案                                                                                                             │
│                                                                                                                      │
│ 创建单个 HTML 文件 ~/snake.html，包含完整的 HTML + CSS + JavaScript。                                     │
│                                                                                                                      │
│ 核心功能                                                                                                             │
│                                                                                                                      │
│ - Canvas 绘制：使用 HTML5 Canvas 绘制游戏画面                                                                        │
│ - 蛇的移动：通过键盘方向键（↑↓←→）控制方向                                                                       │
│ - 食物生成：随机位置生成食物，蛇吃到后身体增长                                                                       │
│ - 碰撞检测：撞墙或撞自身则游戏结束                                                                                   │
│ - 分数显示：实时显示当前得分                                                                                         │
│ - 重新开始：游戏结束后可按空格键重新开始                                                                             │
│                                                                                                                      │
│ 技术细节                                                                                                             │
│                                                                                                                      │
│ - 画布大小：400x400 像素，网格单元 20x20                                                                             │
│ - 游戏循环：使用 setInterval，初始速度 150ms/帧                                                                      │
│ - 防止反向移动（如向右时不能直接向左）                                                                               │
│ - 页面居中显示，深色背景，视觉清晰                                                                                   │
│                                                                                                                      │
│ 文件                                                                                                                 │
│                                                                                                                      │
│ - 新建：~/snake.html（单文件，无外部依赖）                                                                │
│                                                                                                                      │
│ 验证                                                                                                                 │
│                                                                                                                      │
│ - 浏览器打开 snake.html，方向键控制蛇移动                                                                            │
│ - 吃到食物后蛇变长、分数增加                                                                                         │
│ - 撞墙/撞自身游戏结束，空格键重新开始                                                                                │
╰──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╯
```
我们只需要检查这个计划书是否符合我们的需求，如果符合，就直接同意执行即可

```
· Incubating…
●IWrite(snake.html)
●──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
  ⎿  Wrotei205 lines to snake.html                                                                                           <!DOCTYPE html>────────────────────────────────────────────────────────────────────────────────────────────────────
  ⏵⏵ <html lang="zh-CN">on (shift+tab to cycle) · esc to interrupt                                  ◐ medium · /effor
     <head>                                                                                                                  <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">                                                  <title>贪吃蛇游戏</title>                                    t
     <style>
       * { margin: 0; padding: 0; box-sizing: border-box; }
       body {
         background: #1a1a2e;
     … +195 lines (ctrl+o to expand)

●I已创建 ~/snake.html。浏览器打开即可游玩：

  - 方向键 控制蛇移动（按下即开始）                                                                                       - 吃到红色食物蛇变长，得分 +10
  - 撞墙或撞自身游戏结束                                                                                                  - 空格键 重新开始                                                                                                     
```
等待一会儿，claude 按照计划完美完成任务了，我们检查一下效果

![image.png](/static/img/090afee448f333b68172622d22774936.image.webp)

真的可以玩，功能无误。这个任务完美完成了。

# 总结
plan mode是典型的先规划后执行的思维方式，我们在处理一个认为比较重要的事情的时候，先和他不断沟通，把沟通的决策记录下来，保存为设计文档。如果你觉得和你的需求有不一致的地方，你可以和它反复沟通修改计划书。当计划满意之后，直接执行即可

# 附录
源码
```
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>贪吃蛇游戏</title>
<style>
  * { margin: 0; padding: 0; box-sizing: border-box; }
  body {
    background: #1a1a2e;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    font-family: 'Segoe UI', Arial, sans-serif;
    color: #eee;
  }
  #container {
    text-align: center;
  }
  h1 {
    margin-bottom: 10px;
    font-size: 28px;
    color: #0f0;
  }
  #score {
    font-size: 20px;
    margin-bottom: 10px;
  }
  canvas {
    border: 2px solid #0f0;
    background: #16213e;
    display: block;
    margin: 0 auto;
  }
  #message {
    margin-top: 12px;
    font-size: 16px;
    color: #aaa;
    height: 20px;
  }
</style>
</head>
<body>
<div id="container">
  <h1>贪吃蛇</h1>
  <div id="score">得分：0</div>
  <canvas id="game" width="400" height="400"></canvas>
  <div id="message">按方向键开始游戏</div>
</div>
<script>
(function () {
  const canvas = document.getElementById('game');
  const ctx = canvas.getContext('2d');
  const scoreEl = document.getElementById('score');
  const messageEl = document.getElementById('message');

  const GRID = 20;
  const COLS = canvas.width / GRID;
  const ROWS = canvas.height / GRID;
  const SPEED = 150;

  let snake, direction, nextDirection, food, score, gameOver, timer, started;

  function init() {
    snake = [
      { x: 5, y: 10 },
      { x: 4, y: 10 },
      { x: 3, y: 10 }
    ];
    direction = { x: 1, y: 0 };
    nextDirection = { x: 1, y: 0 };
    score = 0;
    gameOver = false;
    started = false;
    scoreEl.textContent = '得分：0';
    messageEl.textContent = '按方向键开始游戏';
    placeFood();
    draw();
    if (timer) clearInterval(timer);
    timer = null;
  }

  function placeFood() {
    while (true) {
      food = {
        x: Math.floor(Math.random() * COLS),
        y: Math.floor(Math.random() * ROWS)
      };
      if (!snake.some(s => s.x === food.x && s.y === food.y)) break;
    }
  }

  function update() {
    direction = nextDirection;
    const head = { x: snake[0].x + direction.x, y: snake[0].y + direction.y };

    if (head.x < 0 || head.x >= COLS || head.y < 0 || head.y >= ROWS) {
      endGame();
      return;
    }

    if (snake.some(s => s.x === head.x && s.y === head.y)) {
      endGame();
      return;
    }

    snake.unshift(head);

    if (head.x === food.x && head.y === food.y) {
      score += 10;
      scoreEl.textContent = '得分：' + score;
      placeFood();
    } else {
      snake.pop();
    }

    draw();
  }

  function endGame() {
    gameOver = true;
    clearInterval(timer);
    timer = null;
    messageEl.textContent = '游戏结束！按空格键重新开始';
    draw();
  }

  function draw() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);

    // Draw grid lines (subtle)
    ctx.strokeStyle = '#1a1a3e';
    for (let i = 0; i <= COLS; i++) {
      ctx.beginPath();
      ctx.moveTo(i * GRID, 0);
      ctx.lineTo(i * GRID, canvas.height);
      ctx.stroke();
    }
    for (let i = 0; i <= ROWS; i++) {
      ctx.beginPath();
      ctx.moveTo(0, i * GRID);
      ctx.lineTo(canvas.width, i * GRID);
      ctx.stroke();
    }

    // Draw food
    ctx.fillStyle = '#e74c3c';
    ctx.beginPath();
    ctx.arc(food.x * GRID + GRID / 2, food.y * GRID + GRID / 2, GRID / 2 - 2, 0, Math.PI * 2);
    ctx.fill();

    // Draw snake
    snake.forEach(function (seg, i) {
      ctx.fillStyle = i === 0 ? '#2ecc71' : '#27ae60';
      ctx.fillRect(seg.x * GRID + 1, seg.y * GRID + 1, GRID - 2, GRID - 2);
    });

    // Game over overlay
    if (gameOver) {
      ctx.fillStyle = 'rgba(0,0,0,0.55)';
      ctx.fillRect(0, 0, canvas.width, canvas.height);
      ctx.fillStyle = '#fff';
      ctx.font = 'bold 30px sans-serif';
      ctx.textAlign = 'center';
      ctx.fillText('游戏结束', canvas.width / 2, canvas.height / 2 - 10);
      ctx.font = '18px sans-serif';
      ctx.fillText('得分：' + score, canvas.width / 2, canvas.height / 2 + 20);
    }
  }

  document.addEventListener('keydown', function (e) {
    if (e.key === ' ' && gameOver) {
      e.preventDefault();
      init();
      return;
    }

    const key = e.key;
    if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(key)) {
      e.preventDefault();
    }

    if (key === 'ArrowUp' && direction.y !== 1) {
      nextDirection = { x: 0, y: -1 };
    } else if (key === 'ArrowDown' && direction.y !== -1) {
      nextDirection = { x: 0, y: 1 };
    } else if (key === 'ArrowLeft' && direction.x !== 1) {
      nextDirection = { x: -1, y: 0 };
    } else if (key === 'ArrowRight' && direction.x !== -1) {
      nextDirection = { x: 1, y: 0 };
    }

    if (!started && !gameOver) {
      started = true;
      messageEl.textContent = '';
      timer = setInterval(update, SPEED);
    }
  });

  init();
})();
</script>
</body>
</html>

```






AI使用指南(3)-基本功能和plan功能演示

在完成claude的安装之后，本文基于claude的简单命令进行介绍，用来进一步了解claude的基本使用技巧

# login
我们有两种办法登录，一个是订阅pro/max方法的登录，一个是apikey的登录。

关于apikey的登录上一个文章已经介绍了。这里介绍订阅的办法。

首先需要能够正常访问claude.ai，如下

![image.png](/static/img/9daaabb0eb60e1edf01615b582aff17e.image.webp)

如果不能访问此网站，需要做如下两个事情
* 你所在是不支持的国家
* 没有能够登录claude.ai的账号

如果登入进去之后，可以看到付费情况

![image.png](/static/img/df337df5ac33d184303a63295507a14e.image.webp)

此时我们需要手机付款，手机付款需要满足如下条件
* 非中国区域apple账号/android账号
* 支付宝购买礼品卡
* 购买pro/max会员

上面都完成了之后，首次登录需要login，此时敲入`/login`后信息如下

![image.png](/static/img/a8022275a5def4b8fe00c409a202f8ba.image.webp)

此时选择第一个 subscription 即可。然后在浏览器的url上成功验证登录即可

当login完成之后，

```
# claude
  ▐▛███▜▌   Claude Code v2.1.83
▝▜█████▛▘  Sonnet 4.6 · Claude Pro
  ▘▘ ▝▝    ~/
```
可以看到，claude pro订阅会员已经正常了。

# init
在一个仓库上进行自动分析代码和文本的时候，可以先尝试init进行分析。这样可以在本地创建记忆文件CLAUDE.md，下次再加载的时候，不需要重复学习
```
● Explore(Explore codebase structure)
  ⎿  Done (8 tool uses · 28.4k tokens · 28s)
  (ctrl+o to expand)

● Write(CLAUDE.md)
  ⎿  Wrote 33 lines to CLAUDE.md
     # CLAUDE.md

     This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.

     ## Running the Server

     ```bash
     # Default upload directory (./uploads)
     python3 run.py

     … +23 lines (ctrl+o to expand)

● Created CLAUDE.md. It covers:
  - How to run the server (with default and custom upload dir)
  - The single-file architecture and key components
  - Security measures already implemented

✻ Sautéed for 51s

```
可以看到claude会自动分析，探索当前目录的下的一切内容，最终生成一份记忆给你
# memory
可以针对当前项目自动生成的`CLAUDE.md`进行自我改造，调整记忆中和你认为偏差的地方
```
❯ /memory

─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
  Memory

    Auto-memory: on
    Auto-dream: off · never

  ❯ 1. Project memory           Saved in ./CLAUDE.md
    2. User memory              Saved in ~/.claude/CLAUDE.md
    3. Open auto-memory folder

  Learn more: https://code.claude.com/docs/en/memory
```
此时可以随时修改 当前目录/当前用户/自动记忆 三个地方的记忆

# permissions
管理权限，默认情况下每次write和select都会提醒你选择，你可以管理你的权限，如下
```
❯ /permissions

─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
  Permissions:  Allow   Ask   Deny   Workspace

  Claude Code can read files in the workspace, and make edits when auto-accept edits is on.

    -  ~/fileupload (Original working directory)
    1. Add directory…
```
当前，也可以管理claude接管的所有目录，当你涉及的目录很多的时候，可以直接通过此命令管理
# context
不同的模型可拥有的上下文长度不一样，可以实时的查看自己用了多少的上下文，如下
```
❯ /context
  ⎿  Context Usage
     ⛁ ⛁ ⛁ ⛁ ⛁ ⛁ ⛁ ⛀ ⛀ ⛁   claude-sonnet-4-6 · 20k/200k tokens (10%)
     ⛁ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶
     ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶   Estimated usage by category
     ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶   ⛁ System prompt: 6.9k tokens (3.4%)
     ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶   ⛁ System tools: 8.1k tokens (4.0%)
     ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶   ⛁ Memory files: 346 tokens (0.2%)
     ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶   ⛁ Skills: 776 tokens (0.4%)
     ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶   ⛁ Messages: 4.3k tokens (2.1%)
     ⛶ ⛶ ⛶ ⛝ ⛝ ⛝ ⛝ ⛝ ⛝ ⛝   ⛶ Free space: 147k (73.3%)
     ⛝ ⛝ ⛝ ⛝ ⛝ ⛝ ⛝ ⛝ ⛝ ⛝   ⛝ Autocompact buffer: 33k tokens (16.5%)
```
可以看到，我这里总共200k的上下文使用了20k上下文。并且提供了tokens的分类。
# clear
如果一次问答完成，可以清空上下文，让claude给你干下一份工作
```
❯ /clear
  ⎿  (no content)

❯ /context
  ⎿  Context Usage
     ⛁ ⛁ ⛁ ⛁ ⛁ ⛁ ⛁ ⛀ ⛀ ⛀   claude-sonnet-4-6 · 16k/200k tokens (8%)
     ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶
     ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶   Estimated usage by category
     ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶   ⛁ System prompt: 6.9k tokens (3.4%)
     ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶   ⛁ System tools: 8.1k tokens (4.0%)
     ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶   ⛁ Memory files: 346 tokens (0.2%)
     ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶   ⛁ Skills: 776 tokens (0.4%)
     ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶ ⛶   ⛁ Messages: 110 tokens (0.1%)
     ⛶ ⛶ ⛶ ⛝ ⛝ ⛝ ⛝ ⛝ ⛝ ⛝   ⛶ Free space: 151k (75.4%)
     ⛝ ⛝ ⛝ ⛝ ⛝ ⛝ ⛝ ⛝ ⛝ ⛝   ⛝ Autocompact buffer: 33k tokens (16.5%)
```
这里可以看到，我clear之后并没有清空我的上下文，主要原因是我自己安装了agent，skill，plugin，mcp，这些东西的description会占用我的上下文。

也就是说，如果你真的很少用到这些skill，清空你的skill是你最佳选择

# effort
我们可以随时调整claude的推理等级（low/medium/high/max），通过effort可以看到当前的推理等级
```
❯ /effort
  ⎿  Effort level: auto (currently medium)
```
# model
同样也可以在里面选择模型，订阅用户可以有如下选项自行选择
```
❯ /model

─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
  Select model
  Switch between Claude models. Applies to this session and future Claude Code sessions. For other/previous model names, specify with --model.

  ❯ 1. Default (recommended) ✔  Sonnet 4.6 · Best for everyday tasks
    2. Opus                     Opus 4.6 · Most capable for complex work
    3. Haiku                    Haiku 4.5 · Fastest for quick answers

  ◐ Medium effort (default) ← → to adjust
```
默认情况下Opus更聪明，我们可以选择Opus
# resume
默认情况下，每次我们打开一个claude的时候都重新创建了一次会话，而实际在使用过程中，我们经常期望接着之前的工作继续做，所以可以使用resume唤醒之前的会话
```
Resume Session
╭───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╮
│ ⌕ Search…                                                                                                                                                                                                                                 │
╰───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╯

❯ /init
  1 hour ago · HEAD · 74.2KB

  Ctrl+A to show all projects · Ctrl+B to toggle branch · Ctrl+V to preview · Ctrl+R to rename · Type to search · Esc to cancel ·

```
正常情况下这里会提供之前使用的所有会话。除非你手动clear过

# 其他基本命令

```
/help	显示帮助信息及可用命令列表
/model	切换或查看当前使用的 AI 模型
/cost	显示当前会话的 Token 使用量和预估费用
/stats	显示当前会话的详细统计数据（如请求次数、Token 消耗等）
/clear	清除终端屏幕上的对话内容
/reset	重置当前对话上下文（清空历史记录，重新开始）
/undo	撤销上一步对文件进行的更改
/retry	重新运行上一个请求
/compact	压缩对话上下文以节省 Token 空间
/config	查看或修改 Claude Code 的配置（如设置、忽略规则等）
/bug	报告错误或向 Anthropic 提供反馈
/init	在当前目录初始化 Claude Code 配置
/exit	退出当前 Claude Code 会话
/resume	切换到其他会话
/rename	重命名当前会话
/memory	查看/编辑 CLAUDE.md 和自动记忆
/permissions	查看/管理权限规则
/hooks	浏览已配置的 Hooks
/agents	创建/管理子代理
/commit	创建 Git 提交
/context	检查上下文窗口使用情况
/effort	设置推理努力等级（low/medium/high/max）
/vim	切换 Vim 编辑模式
/theme	更换终端主题
/terminal-setup	配置终端功能
/statusline	设置状态栏显示
/desktop	发送会话到桌面应用
/teleport	拉取 Web 会话到终端
/btw	快速旁问（不影响对话历史）
```
当然，这里还有三个很重要的命令，后续会逐一介绍，分别为
```
/branch  为此刻创建分支，让你思维存在分支
/rewind  主动移除之前错误的对话
/btw     问一些无关当前探索的问题，不污染当前上下文
```
# 总结
本文介绍了claude的基本命令使用技巧，掌握这些基本命令就可以进行claude的基础使用了。接下来以一个实际的例子来演示claude的基础使用

AI使用指南(2)-基本命令使用

本文介绍ubuntu2404上的opengrok搭建步骤，opengrok是专用于大型代码查看的工具。通过ctags支持源码搜索。本步骤涉及的安装组件有三个： opengrok，tomcat，ctags

# tomcat
```
apt install -y tomcat10
```
如果没有java的话，安装一下java
```
apt install openjdk-21-jdk
```
此时重启tomcat10可以看到服务应该正常
```
systemctl restart tomcat10
```
网页登录后看到如下画面即可

![image.png](/static/img/c9ba51f03fcf46a0293b1a127ec5b968.image.webp)

# ctags
下载代码和安装
```
    $ git clone https://github.com/universal-ctags/ctags.git
    $ cd ctags
    $ ./autogen.sh
    $ ./configure  # use --prefix=/where/you/want to override installation directory, defaults to /usr/local
    $ make
    $ make install # may require extra privileges depending on where to install
```
# opengrok
我们先找到最新的opengrok的release

![image.png](/static/img/fc80ae1f0eb012495661e6e081e6a65e.image.webp)

此时拉取release bin即可
```
wget https://github.com/oracle/opengrok/releases/download/1.14.11/opengrok-1.14.11.tar.gz
```
将其解压
```
tar xvzf opengrok-1.14.11.tar.gz
```
然后找到安装python管理工具
```
python3 -m pip install tools/opengrok-tools.tar.gz
```
创建工作目录
```
export OPENGROK_HOME=/root/work/opengrok/opengrok-1.14.11
mkdir OPENGROK_HOME/{src,data,dist,etc,log}
```
复制war包给tomcat
```
cp $OPENGROK_HOME/lib/source.war /var/lib/tomcat10/webapps/
```
修改tomcat的端口，这里以22222端口为例
```
vim /etc/tomcat10/server.xml
    <Connector port="22222" protocol="HTTP/1.1"
               connectionTimeout="20000"
               redirectPort="8443"
               maxParameterCount="1000"
               />

```
再次重启tomcat
```
systemctl restart tomcat10
```
我们22222端口能进入即可，此时进入`localhost:22222/source`可以看到初始化页面如下

![image.png](/static/img/29eec98f73a4e09e4621f303eef80738.image.webp)

注意，此时没有Repository和Project

# index
接下来就是索引代码仓库了，因为我需要反复阅读内核代码，所以索引内核源码，如下
```
ln -sf path/to/kernel $OPENGROK_HOME/src/kernel
```
这样我们开始index，index的脚本如下
```
export OPENGROK_HOME=/root/work/opengrok/opengrok-1.14.11

java -Xmx16g \
    -Djava.util.logging.config.file=${OPENGROK_HOME}/doc/logging.properties \
    -jar ${OPENGROK_HOME}/lib/opengrok.jar \
    -c /usr/local/bin/ctags \
    -s ${OPENGROK_HOME}/src/ -d ${OPENGROK_HOME}/data -P -S -G \
    -W ${OPENGROK_HOME}/etc/configuration.xml -U http://localhost:22222/source
```
注意，如果需要索引git commit信息，那么加上`-H`，不过会浪费内存。

因为我是mainline kernel，commit message实在太多，索引不了，所以没有`-H`

这里索引会大概1-2小时，等待结束即可

# 最终效果
当索引完成之后，我们直接登入`localhost:22222/source`再看

![image.png](/static/img/d8bb24510f0cbc55ae354c3d2cfffa22.image.webp)

可以看到有kernel仓库了，我们直接找关键函数，例如`scheduler_tick`,直接找到信息如下

![image.png](/static/img/e5397f7e8939d8fcb0ad61ed1a3e9fdc.image.webp)

可以看到，准确找到了sched/core.c的位置

# 参考
> https://github.com/oracle/opengrok/wiki/How-to-setup-OpenGrok
