基于 Claude Code 的 AI 编程工作流探索

Lsx-codeShare

34人浏览 · 2026-07-07 13:47:30

Lsx-codeShare · 2026-07-07 13:47:30 发布

一、 Claude Code 简介

Claude Code 是 Anthropic 推出的面向开发者的 AI 编程协作工具。Claude Code 的核心目标是理解你的整个项目，并参与到真实的编码、修改和重构过程中。Claude Code 不是一个代码生成器，而是一个能读项目、懂上下文、遵守约束的 AI 编程工具。它不是网页里的聊天框，而是直接在你的终端(Terminal)里运行,读取你整个项目的代码，理解文件之间的关系，直接修改代码文件，执行你的指令并给出建议。

二、Claude Code 特性

全局上下文感知：不仅能读单个文件，还能理解整个项目的结构、文件间的依赖关系及架构。
工程级代码修改：可以直接读取并修改代码文件（如批量替换 var 为 let、拆分函数、添加错误处理），而不仅仅是给出建议。
深度分析与解释：能结合上下文解释代码逻辑、排查报错原因及分析性能瓶颈。
可定制行为 (Skills)：通过“技能包”将团队的编码规范、注释要求、测试标准等固化下来，让 AI 自动遵守。
局限性：不能替用户做最终技术决策，不能保证 100% 无 Bug，无法理解未明确说明的业务语义

三、安装教程

3.1、安装 Claude Code

使用官方脚本

curl -fsSL https://claude.ai/install.sh | bash

mac 安装：npm install -g @anthropic-ai/claude-code

安装后验证

claude --version

3.2、配置 Claude Code

配置文件路径：~/.claude/settings.json

{
  "env": {
    "ANTHROPIC_AUTH_TOKEN": "你的Coding Plan API Key",
    "ANTHROPIC_BASE_URL": "https://token-plan.cn-beijing.maas.aliyuncs.com/apps/anthropic",
    "ANTHROPIC_DEFAULT_FABLE_MODEL": "qwen3.7-plus[1M]",
    "ANTHROPIC_DEFAULT_FABLE_MODEL_NAME": "qwen3.7-plus",
    "ANTHROPIC_DEFAULT_HAIKU_MODEL": "glm-5.2",
    "ANTHROPIC_DEFAULT_HAIKU_MODEL_NAME": "glm-5.2",
    "ANTHROPIC_DEFAULT_OPUS_MODEL": "kimi-k2.7-code[1M]",
    "ANTHROPIC_DEFAULT_OPUS_MODEL_NAME": "kimi-k2.7-code",
    "ANTHROPIC_DEFAULT_SONNET_MODEL": "qwen3.7-max[1M]",
    "ANTHROPIC_DEFAULT_SONNET_MODEL_NAME": "qwen3.7-max"
  },
  "custom_instructions": {
    "language": "Always respond in Simplified Chinese. You must not output English explanations or mixed language."
  },
  "includeCoAuthoredBy": false,
  "model": "sonnet",
  "enabledPlugins": {
    "superpowers@claude-plugins-official": true,
    "frontend-design@claude-plugins-official": true,
    "playwright@claude-plugins-official": true
  },
  "effortLevel": "high",
  "theme": "dark",
  "switchModelsOnFlag": true,
  "permissions": {
    "allow": [
      "mcp__codegraph__*"
    ]
  },
  "hooks": {
    "UserPromptSubmit": [
      {
        "hooks": [
          {
            "type": "command",
            "command": "codegraph prompt-hook"
          }
        ]
      }
    ]
  }
}

通过上面步骤，就完成了 Claude Code 的配置。接下来就开始练习如何使用。

3.3、 Claude Code 三种权限模式

模式	行为
正常模式	每次操作前询问
Plan Mode（计划模式）	先说明计划，批准后执行
自动接受模式	直接编辑，不再询问

其他一些小功能：
直接用 @ 提到文件或文件夹
可以拖拉文件到对话框

四、基础使用

4.1、常用命令

命令	功能
`Esc`	执行退出
`/resume`	恢复对话
`/`	列出所有命令
`/clear`	清除会话
`/cost`	查看消耗（防烧 Token）
`/compact`	压缩上下文
`/reset`	切换任务
`/review`	检查 Git 暂存区

4.2、快捷操作

操作	功能
`Ctrl+C`	取消当前操作
`Ctrl+L`	清屏
`Ctrl+O`	切换详细输出
`Ctrl+K`	删除到行尾
`/` 开头	触发斜杠命令
`!` 开头	直接运行 Bash 命令
`@`	触发文件路径自动补全
`\` + Enter	换行输入

五、工作逻辑：代理循环

Claude Code 的核心是代理循环（Agent Loop） ，像人类程序员一样自主工作：

思考 → 行动 → 验证 → （循环）

5.1 模型（大脑）

模型	适用场景
Sonnet	日常编码，速度快，性价比高
Opus	复杂架构设计、深度推理

5.2 内置工具（双手）

工具	能力
文件操作	读取、修改、创建、重命名
搜索	按文件名或正则查找
执行命令	npm、git、测试、启动服务器
网络搜索	查询文档或错误信息
代码智能	LSP 集成、类型检查

示例工作流：运行测试 → 读错误日志 → 搜索相关文件 → 理解代码 → 修改 → 再次验证

5.3 增强能力体系

基础能力
  ├── Skills（技能包）
  ├── MCP（外部服务）
  ├── Hooks（自动化）
  └── SubAgents（子助手）

下面是可以直接补进文章里的 「6. 项目应用」 部分，风格尽量保持清晰、直观、适合读者理解。

六、项目应用

前面介绍的是 Claude Code 的安装、命令和基础能力。真正把 Claude Code 用好，关键在于让它理解你的项目、遵守你的规范，并在合适的模式下协助你完成开发任务。

在实际项目中，Claude Code 通常会围绕以下几个方面展开：

使用 /init 初始化项目上下文
通过 CLAUDE.md 固化项目规则
使用 .claude/ 目录管理命令、规则、技能和子代理

6.1、项目初始化：`/init`

/init 是 Claude Code 在项目中非常重要的一个命令。

它的核心作用是：为当前项目生成一个 CLAUDE.md 文件。

这个文件可以理解为 Claude Code 的“项目说明书”或“长期上下文”。有了它，Claude 每次进入这个项目时，就能快速了解：

这个项目是做什么的
用了哪些技术栈
如何启动、构建和测试
项目的目录结构是什么
团队有哪些代码规范
提交代码时需要遵守哪些约定

6.1.1 如何使用 `/init`

进入项目根目录后，启动 Claude Code：

claude

然后在 Claude Code 会话中输入：

/init

Claude Code 会自动扫描当前项目，并生成一个类似这样的文件：

CLAUDE.md

6.1.2 `CLAUDE.md` 是什么？

CLAUDE.md 是 Claude Code 在当前项目中的核心配置文件。

它不是代码文件，而是一个 Markdown 文档，用来告诉 Claude：

你在这个项目里应该如何工作。

一个典型的 CLAUDE.md 可能包含以下内容：

# Project Overview

This is a React + TypeScript frontend project.

## Tech Stack

- React
- TypeScript
- Vite
- Tailwind CSS
- pnpm

## Common Commands

- Install dependencies: `pnpm install`
- Start dev server: `pnpm dev`
- Run tests: `pnpm test`
- Build project: `pnpm build`

## Code Style

- Use TypeScript for all new files
- Prefer functional components
- Use named exports instead of default exports
- Keep components small and focused

## Project Structure

- `src/components`: reusable UI components
- `src/pages`: page-level components
- `src/hooks`: custom React hooks
- `src/utils`: utility functions

## Development Rules

- Do not introduce new dependencies without confirmation
- Do not modify public APIs unless explicitly requested
- Run tests after changing business logic

6.1.3 `CLAUDE.md` 通常包含哪些内容？

内容	说明
项目描述	当前项目的目标、业务背景、核心功能
技术栈	使用的语言、框架、构建工具、测试框架
常用命令	安装依赖、启动项目、运行测试、打包构建
目录结构	各个目录的职责和用途
代码风格	命名规范、组件规范、注释规范等
架构约定	模块分层、接口设计、状态管理方式
工作流程	提交规范、测试要求、Review 规则
注意事项	不允许随意修改的文件、敏感逻辑说明

6.1.4 使用 `/init` 的好处

1. 建立项目上下文

没有 CLAUDE.md 时，每次你都需要重新告诉 Claude：

这是一个 Vue 项目，用 pnpm，测试用 Vitest，不要用 npm。

有了 CLAUDE.md 后，这些信息可以长期保存在项目中，Claude 每次进入项目时都能自动读取。

2. 保持代码风格一致

团队项目中，最怕 AI 改出来的代码风格和原项目不一致。

比如项目要求：

使用 pnpm
使用 TypeScript
不使用默认导出
API 请求统一放在 services/ 目录
组件统一使用函数组件

这些规则都可以写进 CLAUDE.md，让 Claude 在生成和修改代码时自动遵守。

3. 降低沟通成本

如果一个项目有多个成员，每个人都使用 Claude Code，那么把 CLAUDE.md 提交到 Git 仓库后，团队成员可以共享同一套 AI 使用规范。

这样 Claude 不会因为不同人的描述差异而产生完全不同的代码风格。

6.2 Claude Code 项目结构

在实际项目中，Claude Code 不只依赖一个 CLAUDE.md 文件。随着项目复杂度提升，通常会出现一个专门的 .claude/ 目录，用来管理 Claude 的行为规则、权限、自定义命令、技能和子代理。

一个比较完整的 Claude Code 项目结构如下：

your-project/
├── CLAUDE.md
├── CLAUDE.local.md
├── .mcp.json
├── .claude/
│   ├── settings.json
│   ├── commands/
│   │   ├── review.md
│   │   ├── test.md
│   │   └── release.md
│   ├── rules/
│   │   ├── code-style.md
│   │   ├── git.md
│   │   └── testing.md
│   ├── skills/
│   │   ├── write-unit-tests/
│   │   │   └── SKILL.md
│   │   └── refactor-component/
│   │       └── SKILL.md
│   └── agents/
│       ├── frontend-reviewer.md
│       ├── backend-analyst.md
│       └── data-analyst.md
├── src/
├── package.json
└── README.md

下面逐个说明这些文件和目录的作用。

6.2.1 `CLAUDE.md`：项目级说明书

位置：

CLAUDE.md

作用：

团队共享
放在项目根目录
告诉 Claude 当前项目的整体规则

适合写入：

项目介绍
技术栈
启动命令
测试命令
构建命令
代码规范
架构说明
注意事项

示例：

# Claude Instructions

## Project

This is a Node.js backend service.

## Rules

- Use TypeScript for all new files.
- Do not change database schema without confirmation.
- Use pnpm instead of npm.
- Run `pnpm test` after modifying business logic.

6.2.2 `CLAUDE.local.md`：个人私有规则

位置：

CLAUDE.local.md

作用：

只保存个人本地偏好
不建议提交到 Git
适合存放本地开发相关信息

例如：

# Local Claude Preferences

- My local database is running on port 5433.
- When testing locally, use `.env.local`.
- Prefer shorter explanations unless I ask for details.

因为这个文件可能包含个人环境信息，建议加入 .gitignore：

CLAUDE.local.md

6.2.3 `.claude/settings.json`：权限与安全配置

位置：

.claude/settings.json

作用：

控制 Claude Code 可以执行什么
限制危险命令
作为团队安全基线

例如可以限制 Claude 不允许执行危险命令：

{
  "permissions": {
    "allow": [
      "Bash(pnpm test)",
      "Bash(pnpm build)",
      "Bash(git status)"
    ],
    "deny": [
      "Bash(rm -rf *)",
      "Bash(sudo *)",
      "Bash(curl * | bash)"
    ]
  }
}

这样可以避免 Claude 在自动化执行时误删文件或执行高风险命令。

6.2.4 `.claude/commands/`：自定义斜杠命令

位置：

.claude/commands/

作用：

将重复性任务封装成命令
每个 .md 文件会映射成一个自定义斜杠命令
适合团队标准化流程

例如创建文件：

.claude/commands/review.md

内容：

请检查当前 Git 暂存区的改动，重点关注：

1. 是否存在明显 Bug
2. 是否符合项目代码规范
3. 是否有性能问题
4. 是否需要补充测试
5. 是否有安全风险

请按照“问题 / 影响 / 建议修改”的格式输出。

之后就可以在 Claude Code 中直接使用：

/project:review

这样团队成员不需要每次重复输入长 Prompt。

6.2.5 `.claude/rules/`：模块化行为规则

位置：

.claude/rules/

作用：

拆分长期规则
避免 CLAUDE.md 过于臃肿
让不同类型规则更加清晰

例如：

.claude/rules/code-style.md
.claude/rules/testing.md
.claude/rules/git.md

code-style.md：

# Code Style Rules

- Use TypeScript.
- Avoid `any` unless necessary.
- Prefer small functions.
- Use meaningful variable names.
- Do not introduce new dependencies without approval.

testing.md：

# Testing Rules

- Add unit tests for new business logic.
- Run tests after modifying core modules.
- Follow the existing test style.

这种方式适合中大型项目，可以把规则拆得更清楚。

6.2.6 `.claude/skills/`：自动调用的工作流

位置：

.claude/skills/

作用：

定义复杂工作流
Claude 判断任务匹配时自动调用
适合封装高频开发能力

目录结构示例：

.claude/skills/
└── write-unit-tests/
    └── SKILL.md

SKILL.md 示例：

# Write Unit Tests Skill

When the user asks to add or improve tests:

1. Inspect the target file.
2. Find existing test patterns.
3. Create or update the corresponding test file.
4. Cover normal cases, edge cases, and error cases.
5. Run the test command if allowed.
6. Summarize what was tested.

当你说：

请帮我给这个函数补充单元测试。

Claude 可能会自动读取这个 Skill，并按照里面定义的流程执行。

6.2.7 `.claude/agents/`：子代理角色

位置：

.claude/agents/

作用：

定义不同专业角色
主 Claude 可以把任务分配给不同子代理
子代理拥有独立上下文和权限范围
适合复杂项目中的多角色协作

例如：

.claude/agents/frontend-reviewer.md

内容：

---
name: frontend-reviewer
description: Review frontend code quality and user experience
---

You are a frontend code reviewer.

Focus on:

1. Component structure
2. React hooks usage
3. TypeScript correctness
4. Accessibility
5. UI consistency
6. Performance issues

Do not modify files directly. Only provide review comments and suggestions.

在复杂任务中，主 Claude 可以把不同任务交给不同子代理处理，避免所有上下文都塞到一个会话里。

七、Claude Code 中使用 MCP

MCP 是 Claude Code 连接外部世界的桥梁，让 AI 从"代码顾问"进化为"全能工程师"。

7.1 基础概念

维度	说明
定义	Anthropic 提出的开放协议
作用	让 Claude 实时访问外部系统数据
类比	AI 应用的"USB-C 接口"
能力	访问 GitHub/数据库/Slack/浏览器等

7.2 添加 MCP Server

三种通信方式：

类型	用途
`http`	远程服务
`stdio`	本地进程
`sse`	旧版（已逐渐废弃）

添加远程 HTTP MCP：

claude mcp add --transport http notion https://mcp.notion.com/mcp

添加本地 Node.js MCP：

claude mcp add everything -- npx -y @modelcontextprotocol/server-everything

携带鉴权：

claude mcp add --transport http my-api https://api.example.com/mcp \
  --header "Authorization: Bearer $TOKEN"

7.3 MCP 常用管理命令

命令	功能
`claude mcp list`	列出所有 MCP 服务器
`claude mcp get <name>`	查看指定配置
`claude mcp remove <name>`	移除指定
`/mcp`	会话内查看 + 鉴权
`claude mcp serve`	自身作为 MCP Server

7.4 配置文件

用户级（全局）： ~/.claude.json

项目级（推荐团队共享）： .mcp.json

{
  "mcpServers": {
    "github": {
      "command": "npx",
      "args": ["@modelcontextprotocol/server-github"],
      "env": {
        "GITHUB_TOKEN": "${GITHUB_TOKEN}"
      }
    }
  }
}

7.5 作用域与加载

三层作用域：

作用域	位置	优先级
User	`~/.claude.json`	低
Project	`.mcp.json`	中
Local	项目中项目项	高

八、总结

Claude Code 不是一个简单的聊天机器人，而是一位执行力极强、但需要明确约束的工程师。记住三个关键原则：

提问越具体，产出越精准 — 说清楚背景、目标、约束
选择合适的模式 — Ask 搞清楚、Plan 避免弯路、Edit 谨慎执行
善用 MCP 扩展 — 让 Claude 从"写代码"到"跑代码、测代码、管代码"

开始使用你的 AI 编程伙伴吧！🚀

MCP技术社区

欢迎加入 MCP 技术社区！与志同道合者携手前行，一同解锁 MCP 技术的无限可能！

更多推荐

MCP 为什么成了 AI Agent 的通用接口

MCP技术社区

OpenClaw.NET .NET 原生插件开发完全指南：以 Mempalace 插件为范例

是 .NET 原生插件的元数据声明文件，其结构与传统 TypeScript 插件的},},和typeName字段共同定位插件的入口点，前者指定 DLL 文件的相对路径，后者指定实现接口的完整类型名称，包括命名空间。数组声明了插件提供的能力类型，此处为["memory"]，表明这是一个记忆提供者插件，网关会根据此声明将插件纳入记忆服务的候选列表。jitOnly标志是一个关键的设计决策，设置为true

MCP技术社区

LangChain实用技巧，轻松切换AI大模型

在该层级内，完成核心参数配置：模型名称对应的键名为QWEN_model，base_url对应的键名为QWEN_base_url，api_key对应的键名为QWEN_api_key。如，当设置config_prefix="CODE"时，原本用于指定模型接口地址的参数base_url会自动变成CODE_base_url，从而与其他模型的base_url参数彻底隔离开来。完成config字典的构建后，将

MCP技术社区

所有评论(0)

查看更多评论

Lsx-codeShare

@weixin_47339511

已为社区贡献1条内容

基于 Claude Code 的 AI 编程工作流探索

Lsx-codeShare

一、 Claude Code 简介

二、Claude Code 特性

三、 安装教程

3.1、 安装 Claude Code

3.2、 配置 Claude Code

3.3、 Claude Code 三种权限模式

四、基础使用

4.1、 常用命令

4.2、 快捷操作

五、工作逻辑：代理循环

5.1 模型（大脑）

5.2 内置工具（双手）

5.3 增强能力体系

六、 项目应用

6.1、 项目初始化：/init

6.1.1 如何使用 /init

6.1.2 CLAUDE.md 是什么？

6.1.3 CLAUDE.md 通常包含哪些内容？

6.1.4 使用 /init 的好处

1. 建立项目上下文

2. 保持代码风格一致

3. 降低沟通成本

6.2 Claude Code 项目结构

6.2.1 CLAUDE.md：项目级说明书

6.2.2 CLAUDE.local.md：个人私有规则

6.2.3 .claude/settings.json：权限与安全配置

6.2.4 .claude/commands/：自定义斜杠命令

6.2.5 .claude/rules/：模块化行为规则

6.2.6 .claude/skills/：自动调用的工作流

6.2.7 .claude/agents/：子代理角色

七、Claude Code 中使用 MCP

7.1 基础概念

7.2 添加 MCP Server

7.3 MCP 常用管理命令

7.4 配置文件

7.5 作用域与加载

八、 总结

所有评论(0)

温馨提示：您尚未绑定手机号

Lsx-codeShare

三、安装教程

3.1、安装 Claude Code

3.2、配置 Claude Code

4.1、常用命令

4.2、快捷操作

六、项目应用

6.1、项目初始化：`/init`

6.1.1 如何使用 `/init`

6.1.2 `CLAUDE.md` 是什么？

6.1.3 `CLAUDE.md` 通常包含哪些内容？

6.1.4 使用 `/init` 的好处

6.2.1 `CLAUDE.md`：项目级说明书

6.2.2 `CLAUDE.local.md`：个人私有规则

6.2.3 `.claude/settings.json`：权限与安全配置

6.2.4 `.claude/commands/`：自定义斜杠命令

6.2.5 `.claude/rules/`：模块化行为规则

6.2.6 `.claude/skills/`：自动调用的工作流

6.2.7 `.claude/agents/`：子代理角色

八、总结