2.5 Claude Code 入门配置

Claude Code 可以理解为一个 在电脑里帮你干活的 AI 助手。

你只需要用简单的语言告诉它要做什么，比如「帮我整理这些文件」、「改一下这个程序」、「分析一下这些数据」，它就能理解你的电脑项目，并自动完成很多操作。

它和普通聊天 AI 的区别是：不只是聊天，而是能直接帮你动手做事，比如整理文件、编程、数据分析…等等。

Claude Code 就像一个会自己操作电脑的 AI 助手，帮你更快完成各种工作。

第一步：准备工作

1.1 安装 Claude Code

使用终端、命令行还是挡住了非常多的朋友，这个时候，有个界面很重要！

Claude code、Codex 官方也都推出了插件，安装即可使用。

第一步：安装必备软件

安装 vs code

https://code.visualstudio.com/ 

在 vs vode 官网下载安装，免费的，它主要是用来编程的，但我们主要用它运行 Claude code 插件。

安装 claude code 插件

点击链接：https://marketplace.visualstudio.com/items?itemName=anthropic.claude-code，会自动跳转到  vs code 安装。

或者在 vs code 插件市场搜索「Claude code」，即可安装

安装 git

Git 是运行 claude code 必备的软件，用来做代码版本管理，需要安装。

• Windows：https://git-scm.com/install/windows  ，一般选「Git for Windows/x64 Setup.」，如果电脑芯片是 ARM，则选下面那个。安装的时候，一路默认安装即可。安装之后，需要重新启动 vs code。

• Mac：https://git-scm.com/install/mac 
  • 复制 xcode-select --install，打开「终端」，粘贴按回车。会弹出来安装程序，完成安装即可。
  • 如果你 Mac 上已经安装了 brew，执行 brew install git 即可。安装之后，需要重新启动 vs code。

第二步：配置账号

唯一的门槛，就是搞定一个能在 Claude code 里用的账号。

可以这样理解 Claude code：它是一个工具，Claude code 和大模型的关系，就像手机和运营商的关系。你的手机可以选电信、联通、移动，都能打电话上网， Claude code 就相当于手机，大模型就相当于运营商，你可以在 Claude code 使用各种模型，你只需要为大模型付费。

Claude 官方会直接封中国用户的账号，所以使用官方账号门槛很高。

推荐使用中转方案，或者用国产大模型平替。

如何选择？

• 如果追求效果最好，选中转；
• 如果追求简单方便，选国产大模型。

**第三步 **：在 Claude code 里配置账号

方案 1：使用 cc Switch 配置

Cc Switch 是一个配置 Claude code apikey，切换管理配置的工具，推荐下载使用。

• Windows 版本：

安装的时候，会弹出来安全确认，点击「更多信息」，即可继续安装

• Mac

注意：由于作者没有苹果开发者账号，首次打开可能出现”未知开发者”警告，请先关闭，然后前往”系统设置” → “隐私与安全性” → 点击”仍要打开”，之后便可以正常打开。

• 安装后，选择「Codex」，然后点右上角的+新建配置。

cc Switch：https://github.com/farion1231/cc-switch 

下载安装最新版：https://github.com/farion1231/cc-switch/releases 

如何配置：

1. 点右上角新建，选择「自定义配置」,供应商名字随便填，然后填入 apikey 和请求地址，点「保存」即可。
2. API key 就是你之前购买账号获得的 API
3. 请求地址是购买账号的服务地址，例如 ``https://hongmacc.com/api, https://4api.top，可参考服务商提供的配置文档。

• 在 cc Switch 里勾选**「应用到 Claude code 插件」和「跳过初次安装确认」**，然后重新启动 vs code。

如何判断账号是否配置成功：

• 点开 claude code 插件，和它说句话，它如果正常回应你，说明配置成功！

可能碰到的问题：

方案 2：手动配置

在~/.claude 目录下，创建一个 settings.json 文件，保存即可。

把真实的 apikey 和 base url 填写正确。

{  "env": {    "ANTHROPIC_AUTH_TOKEN": "or_ea8*********************e29557f4",    "ANTHROPIC_BASE_URL": "https://"  },  "includeCoAuthoredBy": false}

第三步：使用 Claude code

• 配置上账号 
• 在 vs code 里，打开一个工作文件夹。工作文件夹的是 Claude code 读取和写入文件的范围。
• 点击 Claude code 图标，即可使用。

Claude code 核心功能概览

体验 Claude code

刚装上不知道用 claude code 做什么？？ 让 Claude code 帮你整理文件

进阶：用 API Key + cc Switch 配置（可选）

如果你走「官方账号登录」之外的路线，需要用 API Key 配置。下面用图形化工具 cc Switch 完成，免去手动改配置。

⚡ 关键配置速查

• Base URL：https://你的API中转服务地址
• 环境变量名：必须是 ANTHROPIC_AUTH_TOKEN（不是 ANTHROPIC_API_KEY）
• 模型名：以 你的API中转服务地址 控制台「模型列表」显示为准

第一步：在 你的API中转服务地址 获取 API Key

1. 浏览器打开 你的API中转服务地址 ，注册或登录账号
2. 进入控制台，找到「令牌管理」菜单
3. 点击「新建令牌」，名称填写 Claude Code
4. 令牌分组：选择 default 或更高的 Claude 分组Claude Code 兼容 default 及以上的所有分组，区别仅在于 API 来源和消耗倍率不同（倍率越低越省钱，倍率越高通常稳定性更好）。新手先选 default 即可。
5. 提交后复制生成的 sk- 开头字符串，这就是你的 API Key，请妥善保存

接下来你将使用以下三项信息：

第二步：下载并安装 cc Switch

cc Switch 是一款图形化 API 配置工具，免去手动改文件、写环境变量的繁琐操作。

下载安装包

📦 本教程文档已附带 cc Switch v3.14.1 安装包，请在文档下方附件区下载：

• macOS 用户下载：
• Windows 用户下载：

安装

• macOS：双击 .dmg 文件，将 cc Switch 拖入「应用程序」文件夹
• Windows：双击 .msi 文件，按提示完成安装

在 cc Switch 中配置 Claude Code

1. 启动 cc Switch
2. 在左侧切换到 Claude Code 选项卡
3. 点击「新建配置」
4. 按下表填写：

1. 点击保存后再设置里勾选「应用到 Claude Code 插件」与「跳过初次安装确认」
2. 再次点击保存

第三步：选择使用方式

cc Switch 配置完成后，推荐用 VS Code 插件 来使用 Claude Code（对新手最友好，本课程也以此为主）。

方式 A：VS Code 插件（推荐小白）

A.1 安装 VS Code

下载地址：https://code.visualstudio.com/ 

按默认设置完成安装即可。

A.2 安装 Claude Code 插件

打开 VS Code，点击左侧扩展图标，搜索 Claude Code，选择 Anthropic 发布的官方插件并安装。

也可直接通过链接安装：https://marketplace.visualstudio.com/items?itemName=anthropic.claude-code 

A.3 验证

cc Switch 已经把配置写好了，关闭并重新打开 VS Code。在 VS Code 中打开任意文件夹，点击左侧 Claude Code 图标，在输入框中发送hi：

收到正确回复即配置成功。

A.4 插件常用功能

• 输入需求 + 回车：直接描述你要完成的任务
• @ 引用文件或文件夹：指定 Claude 阅读的上下文
• 斜杠命令 /：切换模型、管理 agents、管理 MCP
• 工作模式：Plan / Ask before edit / Edit automatically
• 历史会话：查看与恢复之前的对话

首次使用建议

进入项目目录后，建议先以只读方式让 Claude 分析项目，再让其执行修改：

确认 Claude 理解准确后，再下达修改指令。

常见问题

Q1：API Key 在哪里生成？

在 你的API中转服务地址 控制台「令牌管理」菜单中生成。Claude Code 本身不生成 Key。

Q2：Base URL 应该写什么？

写 https://你的API中转服务地址不要再添加任何路径。

Q3：应使用 ANTHROPIC_API_KEY 还是 ANTHROPIC_AUTH_TOKEN？

你的API中转服务地址 使用 ANTHROPIC_AUTH_TOKEN。cc Switch 会自动写入正确的变量名。

Q4：报错 Invalid API key？

请检查：Key 是否完整复制、前后是否有空格、令牌是否被禁用、账户余额是否充足。

Q5：报错 404？

通常是 Base URL 写错。请确认填写的是 https://你的API中转服务地址

Q6：cc Switch 与手动编辑配置文件有什么区别？

最终效果一致，cc Switch 提供图形界面，免去手动编辑配置文件，并且支持一键在不同 API 配置之间切换。

Q7：提示 request body too large？

发送内容过大（常见于直接发送图片）。请新建会话，避免一次性发送大文件。

模型与计费

模型列表与价格请以 你的API中转服务地址 控制台「模型列表」页面显示为准。

如遇问题，可在 你的API中转服务地址 控制台联系客服。

第二步：做你的第一个作品

2.1 我们要做什么？

我建议第一个项目做「待办清单」。

为什么？

• 够简单，15 分钟能完成
• 够实用，做完了真的能用
• 够完整，该有的功能都有（增删改查）

最终效果是什么样？

一个网页，你可以：

• 添加任务
• 标记任务完成
• 删除任务
• 界面干净好看

复制这段话，发给 Claude：

我想做一个待办清单网页，要求：1. 可以添加新任务（输入框+添加按钮）2. 可以点击任务标记为完成（会有划线效果）3. 可以删除任务（每个任务旁边有删除按钮）4. 界面要简洁美观，用现代化的设计请先给我一个实现计划，包括用什么技术、分几个文件、大概的实现步骤，等我确认后再开始写代码。

Claude 会回复类似这样：

好的，我来规划这个待办清单应用：## 技术选择- HTML：页面结构- CSS：样式设计（使用 Flexbox 布局）- JavaScript：交互逻辑## 文件结构1. index.html - 主页面2. style.css - 样式文件3. script.js - 功能代码## 实现步骤1. 创建 HTML 基础结构（输入框、按钮、任务列表区域）2. 编写 CSS 样式（现代卡片设计+渐变背景）3. 实现 JavaScript 功能（添加、完成、删除）4. 添加本地存储，刷新页面后数据不丢失准备好了吗？我可以开始实现。

你只需要回复：「好的，开始吧」

2.2 看着代码自己写出来

这是最神奇的部分。

你会看到 Claude 开始自己工作：

• 创建 index.html 文件
• 写入 HTML 代码
• 创建 style.css 文件
• 写入样式代码
• 创建 script.js 文件
• 写入交互逻辑

整个过程你什么都不用做。就像看着一个程序员在你的电脑上工作。

每创建一个文件，Claude 都会告诉你它在做什么。比如：

创建 index.html...添加了页面基础结构，包括标题、输入区域和任务列表容器创建 style.css...使用了现代化的卡片设计，添加了渐变背景和阴影效果创建 script.js...实现了添加、完成、删除功能，并加入了本地存储

大概 2-3 分钟，所有代码就写完了。

2.3 打开浏览器看效果

代码写完后，Claude 会告诉你怎么运行。通常会说：

已完成！你可以直接用浏览器打开 index.html 查看效果。或者在终端运行：python3 -m http.server 8000然后在浏览器访问 http://localhost:8000

Mac 用户：直接在 Finder 里找到 my-todo-app 文件夹，双击 index.html

Windows 用户：在文件资源管理器里找到这个文件夹，双击 index.html

浏览器会打开，你会看到：

• 顶部有个大标题「我的待办清单」
• 一个输入框，旁边有「添加」按钮
• 下面是任务列表区域

试试添加一个任务：「学会用 Claude Code」，点击添加。

你的第一个任务出现了！

点击任务可以标记完成（会有划线），旁边的删除按钮可以删掉它。

恭喜，这就是你用 AI 做出的第一个作品。

第三步：加一个新功能

现在你可能会想：能不能改改？

当然可以，而且超级简单。

3.1 提一个新需求

假设你想给每个任务加上时间戳，显示是什么时候添加的。

直接在 Claude Code 里说：

我想给每个任务加上创建时间，格式是「2025-11-10 15:30」，显示在任务文字的下面，用小字灰色显示

3.2 Claude 会自动修改

Claude 会：

1. 告诉你需要改哪些地方
2. 自动修改 script.js 添加时间记录逻辑
3. 自动修改 style.css 添加时间显示的样式

你只需要刷新浏览器，新功能就生效了。

这就是 AI 协作的感觉：你提需求，它写代码，你验收效果。

不满意？继续对话调整。

3.3 试试其他功能

你还可以尝试：

• 「加一个优先级标签，重要的任务显示红色」
• 「加一个全部删除按钮」
• 「换一个配色方案，我想要蓝色系」

每次 Claude 都会理解你的意思，自动改代码。

第四步：新手常见问题

在过去半年教学员用 Claude Code 的过程中，我发现新手最常问这些问题：

Q1：改错了怎么办？

别慌，Claude Code 有「时光机」功能。

方法一：按 ESC 两次

快速回退到上一个版本

方法二：输入命令

/rewind

Claude 会列出历史版本，你可以选择回到哪个时间点

方法三：直接说

「刚才那个改动我不喜欢，还原回去」

Q2：我完全不懂代码，怎么知道 Claude 做的对不对？

答案：你不需要懂代码，你只需要测试功能。

就像你不需要懂汽车发动机，也能知道车能不能开。

• 添加任务试试，能加上吗？
• 标记完成试试，有划线吗？
• 删除试试，真的删掉了吗？
• 刷新页面，数据还在吗？

功能对了，代码就是对的。

有问题？直接告诉 Claude：「删除按钮点了没反应」，它会自己检查和修复。

Q3：request body to0 large 报错是什么意思？

• 发给 claude code 的图片太大时，会导致报错，因为超出了它的处理能力。

解决办法：新开一个对话。之前的对话继续，也会带上之前发的图片，所以无法继续。

所以，后续不要给 AI 发长图、大图。

Q4：我应该从这个开始学编程吗？

这取决于你的目标。

如果你想快速做出东西（做个工具、验证个想法、自动化工作）：

• 从 Claude Code 开始是对的
• 边做边学，有问题就问 Claude
• 遇到不懂的概念，让 Claude 解释

如果你想成为专业开发者：

• Claude Code 是很好的辅助，但不能替代系统学习
• 建议路径：用 AI 做出第一个项目（建立信心）→ 系统学习基础（CS50、FreeCodeCamp）→ 再用 AI 加速开发

我在 WaytoAGI 社区的观察：很多人就是通过 Claude Code 找到了编程的乐趣，然后主动去学了 JavaScript、Python。

因为当你做出东西的时候，学习的动力完全不一样。

Q5：使用 cc Switch 配置后，API 和 base url 都正确，为什么还是报错？

报错图：

正确配置：

配置里，需要正确使用 ANTHROPIC_API_KEY 或 ANTHROPIC_AUTH_TOKEN，取决于你使用的服务商。

Q6：为什么执行一键安装报错？

如果你挂了🪜，但命令行里默认不会走🪜，所以需要额外配置一下，类似于：

export https_proxy=http://127.0.0.1:1235 http_proxy=http://127.0.0.1:1235 all_proxy=socks5://127.0.0.1:1234

按回车，然后再次执行安装命令。

Q7：VS code 是英文，怎样换成中文？

安装这个中文语言包即可：

https://marketplace.visualstudio.com/items?itemName=MS-CEINTL.vscode-language-pack-zh-hans 

Q8：如何切换主题

🪟 Windows（最推荐方法）

👉 用“命令面板”，最直观 打开 VS Code 按键盘：Ctrl + Shift + P 输入：theme 点击：Preferences: Color Theme 用鼠标点一个主题就能立即预览，喜欢就停下

✔ 优点：不用记复杂快捷键

✔ 适合：完全新手

🍎 mac（最推荐方法）

👉 操作几乎一样，只是按键不同 打开 VS Code 按键盘：Cmd + Shift + P 输入：theme 选择：Preferences: Color Theme 点击喜欢的主题

下一步：你可以做什么？

完成了这 15 分钟的教程，你已经掌握了：

• ✅ 安装和认证 Claude Code
• ✅ 先规划再动手的方法
• ✅ 让 AI 写代码并运行
• ✅ 迭代修改功能
• ✅ 解决常见问题

接下来试试这些：

1. 做个你真正需要的工具

• 记账页面？
• 倒计时器？
• 个人简历网站？

2. 挑战：给待办清单加功能

• 加一个「优先级」分类（高/中/低）
• 加一个搜索功能
• 换成你喜欢的配色