1. 安装教程

  1. 安装Node.js

    Node.js — Download Node.js®

  2. 安装Claude Code

    npm install -g @anthropic-ai/claude-code
  3. 设置环境变量

    方法一:PowerShell 临时设置(当前会话)

    $env:ANTHROPIC_BASE_URL = "https://www.88code.org/api"
    
    $env:ANTHROPIC_AUTH_TOKEN = "你的API密钥"

    方法二:PowerShell 永久设置(用户级)

    # 设置用户级环境变量(永久生效)
    [System.Environment]::SetEnvironmentVariable("ANTHROPIC_BASE_URL", "https://www.88code.org/api", [System.EnvironmentVariableTarget]::User)
    [System.Environment]::SetEnvironmentVariable("ANTHROPIC_AUTH_TOKEN", "你的API密钥", [System.EnvironmentVariableTarget]::User)

    设置后需要重新打开 PowerShell 窗口才能生效。

2. MCP配置教程

I. Context7 : 永远保持最新同步全网最全的代码文档库

github: GitHub - upstash/context7: Context7 MCP Server -- Up-to-date code documentation for LLMs and AI code editors

官网:https://context7.com

推荐指数:⭐⭐⭐⭐⭐


介绍

目前主流的大语言模型(如 OpenAIClaudeDeepSeek)的训练数据往往滞后于技术的更新,导致生成的代码常常基于已经废弃的旧版 API。尤其是前端组件甚至每两周都更新一次,使用 context7 能够实时文档获取,减少 AI 幻觉,context7 覆盖了所有主流库,并且完全免费!


使用教程

获取 API Key

首先访问官网:https://context7.com 点击 Sign In 进行登录,如果没有注册过,那么先注册一下账号

image

点击 Click here to generate an API key 生成属于自己的专属 API Key

image

点击复制按钮,需要保存好 API key,因为只会出现一次,忘记后需要重新生成。

image


Claude Code 添加 mcp

在启动 claude code cli 之前,执行如下命令来添加 mcp(注意如果已经启动了 cli,需要在添加 mcp 之后,先退出 cli 再重新进入)

claude mcp add --transport sse context7 https://mcp.context7.com/sse --header “CONTEXT7_API_KEY: 此处替换为刚才获取的 key”

image


codex 添加 mcp

windows 用户进入 C:\Users\testuser\.codex 目录编辑 config.toml 文件,添加如下配置,mac 和 linux 用户打开终端,vi ~/.codex/config.toml,粘贴后按一下键盘上的 "ESC" 案件,将输入法调成英文,输入:wq 后按下 Enter 键保存并且退出。

[mcp_servers.context7]
args = [“-y”, “@upstash/context7-mcp”, “–api-key”, “此处替换为刚才获取的 key”]
command = “npx”

执行 claude 或者 codex 进入 cli 后,执行 /mcp 查看现有的 mcp,可以看到 context7 已连接,按一下键盘上的 Esc 键退出

image


执行效果

提问的最后添加上 use context7,输入:“请获取下最新的 tailwind css 版本 use context7”,使用键盘上的 ↓ 调到总是允许,然后按一下 Enter 键

image

图中可以看到已经使用 context7 成功获取了文档

image

如果是 Windows,为了避免换行符影响,应执行下面命令

git config --global core.autocrlf true

II. playwright : 浏览器自动化测试

github:GitHub - microsoft/playwright-mcp: Playwright MCP server

推荐指数:⭐⭐⭐⭐⭐


介绍

Playwright 是一个用于 Web 测试和自动化的框架。它允许使用单一 API 测试 Chromium、Firefox 和 WebKit。Playwright 旨在实现跨浏览器的 Web 自动化,具有功能强大可靠快速的特点。

playwright-mcp 一个使用 Playwright 提供浏览器自动化功能的模型上下文协议(MCP)服务器。该服务器使大语言模型能够通过结构化的可访问性快照与网页进行交互,无需依赖截图或视觉调优模型,该 mcp 能让 agent 自动打开浏览器,并且自动化执行点击、输入、滚动操作,能够测试 web 项目的各项功能是否存在 bug。


使用教程

claude code

进入项目目录后,直接执行以下命令,然后重启 claude code cli

claude mcp add playwright npx @playwright/mcp@latest

codex

windows 用户进入 C:\Users\testuser\.codex 目录编辑 config.toml 文件,添加如下配置,mac 和 linux 用户打开终端,vi ~/.codex/config.toml,粘贴后按一下键盘上的 "ESC" 案件,将输入法调成英文,输入:wq 后按下 Enter 键保存并且退出。

[mcp_servers.playwright]
command = “npx”
args = [“@playwright/mcp@latest”]

执行 claude 进入 cli 后,执行 /mcp 查看现有的 mcp,可以看到 playwright 已连接,按一下键盘上的 Esc 键退出

image

执行效果

输入:启动项目 使用浏览器打开本项目 告诉我登录页有哪些内容

image

自动启动项目,然后打开了浏览器访问项目

image

image

III. Serena : 一个强大的编程智能体工具包,提供语义检索和编辑能力

github: GitHub - oraios/serena: A powerful coding agent toolkit providing semantic retrieval and editing capabilities (MCP server & other integrations)

推荐指数:⭐⭐⭐⭐⭐


介绍

普通 AI 助手

Serena + AI

只能 “看” 你发给它的代码片段

直接访问整个项目,像 IDE 一样理解代码结构

回答基于文本模式匹配

基于语言服务器协议(LSP),知道函数在哪、变量怎么用

修改代码 = 替换整文件

能做 “手术刀式修改”,精准插入、替换、重构

无法运行代码或执行命令

可以读写文件、运行测试、执行终端命令


使用教程

安装 UV 依赖

Serena 依赖 uv 的现代 Python 包管理器,比 pip 更快。


Windows 用户

打开 PowerShell(右键开始菜单 → Windows PowerShell),粘贴并运行以下命令:

1. 设置安装目录(可自定义)
set UV_INSTALL_DIR=D:\tools\uv
2. 下载并安装 uv
powershell -ExecutionPolicy ByPass -c “irm https://astral.sh/uv/install.ps1 | iex”

Mac 或者 Linux 用户

打开终端,运行:

curl -LsSf https://astral.sh/uv/install.sh | sh

安装完成后,重启终端!重启终端!,** 重启终端!** 输入 uv --version,如果看到版本号,说明成功了!


添加 mcp

claude code

首先进入项目目录,注意:此操作需要在重启终端后,否则会找不到 uvx 命令,启动不了 serena 服务,导致 mcp 连接不上,同时需要确保到 github 的网络通畅,

claude mcp add serena -- "uvx --from git+https://github.com/oraios/serena serena start-mcp-server --transport stdio --context ide-assistant --project $(pwd)"

image

如果连接不上 github,先进入项目目录,然后执行,git clone https://github.com/oraios/serena,下载该项目,然后将以下的目录替换为自己的项目目录,执行添加 mcp 的命令

claude mcp add serena – uvx --from D:\project\my\open-webui\serena serena start-mcp-server --context ide-assistant --project $(pwd)

codex

windows 用户进入 C:\Users\testuser\.codex 目录编辑 config.toml 文件,添加如下配置,mac 和 linux 用户打开终端,vi ~/.codex/config.toml,粘贴后按一下键盘上的 "ESC" 案件,将输入法调成英文,输入:wq 后按下 Enter 键保存并且退出。

[mcp_servers.serena]
command = “uvx”
args = [“–from”, “git+https://github.com/oraios/serena”, “serena”, “start-mcp-server”, “–context”, “codex”]

执行 claude 或者 codex 进入 cli 后,执行 /mcp 查看现有的 mcp,可以看到 serena 已连接,按一下键盘上的 Esc 键退出

image

同时浏览器会自动打开 serena 服务的网页端

image


为项目建立索引

进入项目,然后执行以下命令 (使用 cmd,不要使用 power shell 以及 idea、pycahrm、goland 等 ide 中的终端)

uvx --from git+https://github.com/oraios/serena serena project index

执行这个命令可能会报错,因为不同语言需要,这里以 go 语言为例,执行后报错 (最后一行)RuntimeError: Found a Go version but gopls is not installed.,这表示,Serena 需要使用 gopls 来为 Go 项目提供语言服务功能(如代码分析、补全等),但它在你的系统上找不到 gopls。

image

在项目目录执行 go install golang.org/x/tools/gopls@latest 安装依赖,然后重新执行建立索引的命令,可以看到索引建立成功,但是有个 go 文件失败了,可以再多次重试解决。

image


写入记忆文件

执行 claude 命令进入 cli,输入 "can you access serena",然后一直点击允许即可

image


执行效果

输入:找到 api/v1/admin/captcha/config 这个接口 并且描述下实现 use serena,可以看到已经在使用 serena 进行语义检索了

image

3. Claude Code 中转站

  1. Claude Code中国站 - 管理后台

    免费套餐每天 20 刀额度

    [88code]codex 正式上线,每天 40 刀全免费无倍率不扣积分 - 福利羊毛 - LINUX DO

  2. Any Router

    每天登录领取25刀

  3. AI Code Editor - Claude Code Official Shared Platform

    每天 赠送1000积分

    [Ai Code Editor] Claude Code的镜像站,新站上线送福利,欢迎各位巨佬体验,长期有效~~ - 福利羊毛 - LINUX DO

  4. ShareYourCC - Claude Code 共享管理平台

    每天抽奖1-5刀

    【SHAREYOURCC】 Claude Code分享站我又带着金闪闪回来啦!限时开放注册! - 福利羊毛 - LINUX DO

4. 引用

感谢以下文章内容

claudecode或者codex必备mcp详细安装教程,包含context7、playwright、serena(评论区抽 5 位赠送 15 元额度) - 开发调优 - LINUX DO

Claude Code中国站 - 管理后台