---
layout: home

hero:
  name: XCodeCLI
  text: 全能 AI 开发配置中心
  tagline: 统一管理 Claude Code / Gemini CLI / Codex 及 Cherry Studio 配置
  actions:
    - theme: brand
      text: 快速开始
      link: /guide/
    - theme: alt
      text: Cherry Studio 教程
      link: /cherry-studio-nanobana

features:
  - icon: 🚀
    title: CLI 一键配置
    details: 一行命令自动配置 Claude Code、Gemini CLI 和 Codex
  - icon: 🍒
    title: Cherry Studio 支持
    details: 完美适配 Cherry Studio，支持 Gemini 系列模型可视化交互
  - icon: 🔒
    title: 安全可靠
    details: 自动备份现有配置，本地化管理 API 密钥
---

<script setup>
import { ref } from 'vue'

const activeTab = ref('bash')
const copied = ref(false)

const commands = {
  bash: `API_KEY='你的密钥' bash -c "$(curl -fsSL https://gitea.sususu.cf/sususu/xcodecli-shells/raw/branch/main/setup.sh)"`,
  powershell: String.raw`$key='你的密钥'; $f="$env:TEMP\xc.ps1";iwr -useb https://gitea.sususu.cf/sususu/xcodecli-shells/raw/branch/main/setup.ps1 -OutFile $f;& $f`
}

function copyCommand() {
  navigator.clipboard.writeText(commands[activeTab.value])
  copied.value = true
  setTimeout(() => copied.value = false, 2000)
}
</script>

<div class="api-endpoints-banner">
  <h2>API 端点一览</h2>
  <p class="banner-desc">根据模型系列选择对应的 API 端点</p>
  <div class="endpoint-grid">
    <div class="endpoint-card gpt">
      <span class="endpoint-label">GPT 系列</span>
      <code>https://api.xcodecli.com/v1/responses</code>
    </div>
    <div class="endpoint-card claude">
      <span class="endpoint-label">Claude 系列</span>
      <code>https://api.xcodecli.com/v1/messages</code>
    </div>
    <div class="endpoint-card gemini">
      <span class="endpoint-label">Gemini 系列</span>
      <code>https://api.xcodecli.com/v1beta</code>
    </div>
  </div>
</div>

<div class="setup-section">

## 1. CLI 工具一键配置

<p class="desc">适用于 <strong>Claude Code</strong>、<strong>Gemini CLI</strong> 和 <strong>Codex</strong> 的自动化配置。</p>

<div class="install-card">
  <div class="tabs">
    <button :class="{ active: activeTab === 'bash' }" @click="activeTab = 'bash'">
      <span class="icon">🍎/🐧</span> macOS / Linux
    </button>
    <button :class="{ active: activeTab === 'powershell' }" @click="activeTab = 'powershell'">
      <span class="icon">🪟</span> Windows
    </button>
  </div>

  <div class="code-block-wrapper">
    <div class="code-block">
      <code>{{ commands[activeTab] }}</code>
    </div>
    <button class="copy-btn" @click="copyCommand" :class="{ copied: copied }">
      {{ copied ? '已复制' : '复制命令' }}
    </button>
  </div>
</div>

<p class="tip">💡 提示：运行前请将命令中的 <code>你的密钥</code> 替换为实际 API Key。<strong>配置完成后请重启终端</strong>，否则工具可能无法读取 API 密钥。</p>

</div>

<div class="setup-section">

## 2. Cherry Studio 配置

<p class="desc">在 Cherry Studio 中使用 XCodeCLI 服务，享受可视化的对话体验。</p>

::: tip 💡 Cherry Studio 模型兼容性
Cherry Studio 支持所有模型，但注意 **ccmax 分组的 Claude 模型不可用**（ccmax 只能用于 Claude Code）。Claude 模型请使用 **cc2api** 分组。
:::

### 配置参数

请在 Cherry Studio 设置中添加 **自定义提供商**：

| 配置项         | 值                          | 说明                     |
| :------------- | :-------------------------- | :----------------------- |
| **提供商类型** | `Gemini`                    | **必选** (不要选 OpenAI) |
| **API 密钥**   | `sk-...`                    | 你的 XCodeCLI 密钥       |
| **API 地址**   | `https://api2.xcodecli.com` | Base URL                 |

::: tip 📝 详细教程
查看完整的 [Cherry Studio 图文配置指南](/cherry-studio-nanobana)
:::

</div>

<div class="setup-section">

## 2.5 API 分组说明

<p class="desc">XCodeCLI 提供多个 API 分组，适用于不同的使用场景。</p>

::: warning 🔑 分组区别

- **cc2api 分组（推荐）**：提供 Claude 系列模型，无客户端限制，可自由搭配各种客户端
- **ccmax 分组**：提供 Claude 系列模型，但**只能用于 Claude Code**
  :::

### cc2api — 推荐使用

cc2api 分组包含 **Claude 系列模型**，无客户端限制。推荐搭配以下工具：

| 客户端                                          | 类型             | 说明                                                                                  |
| :---------------------------------------------- | :--------------- | :------------------------------------------------------------------------------------ |
| **[OpenCode](https://opencode.ai/)**            | 终端 AI 编码代理 | 开源，支持 75+ LLM 供应商，可作为 Claude Code 的替代方案。支持终端、桌面端和 IDE 插件 |
| **[OpenClaw](https://openclaw.ai/)**            | 个人 AI 助手     | 开源，连接 WhatsApp / Telegram / Slack 等消息平台，支持浏览器自动化、邮件、日历等操作 |
| **[Cherry Studio](https://www.cherry-ai.com/)** | 可视化对话客户端 | 支持多服务商集成，详见 [配置教程](/cherry-studio-nanobana)                            |

::: tip 💡 GPT 系列模型
GPT 系列模型推荐使用 `v1/responses` 端点以获得最佳效果。
:::

### ccmax — 仅限 Claude Code

ccmax 分组同样提供 Claude 系列模型，但**只能**用于 Claude Code，不支持其他客户端。如果你使用 Claude Code 且 cc2api 遇到兼容性问题，可尝试切换到 ccmax。

</div>

<div class="setup-section">

## 3. 参考信息

### CLI 配置文件位置

| 工具            | 配置文件                  | 格式 |
| :-------------- | :------------------------ | :--- |
| **Claude Code** | `~/.claude/settings.json` | JSON |
| **Gemini CLI**  | `~/.gemini/.env`          | ENV  |
| **Codex**       | `~/.codex/config.toml`    | TOML |

### API 端点

脚本会自动测试以下端点，选择第一个可用的：

- `https://api2.xcodecli.com` (主要)
- `https://api.xcodecli.com` (备用)

</div>

<style>
/* API Endpoints Banner */
.api-endpoints-banner {
  margin: 2rem auto 0;
  max-width: 960px;
  padding: 2rem 1.5rem;
  text-align: center;
}

.api-endpoints-banner h2 {
  font-size: 2rem;
  font-weight: 800;
  margin-bottom: 0.5rem;
  border-top: none;
}

.banner-desc {
  color: var(--vp-c-text-2);
  font-size: 1.1rem;
  margin-bottom: 1.5rem;
}

.endpoint-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}

@media (max-width: 768px) {
  .endpoint-grid {
    grid-template-columns: 1fr;
  }
}

.endpoint-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  padding: 1.5rem 1rem;
  border-radius: 12px;
  border: 2px solid var(--vp-c-divider);
  background: var(--vp-c-bg-soft);
  transition: transform 0.2s, box-shadow 0.2s;
}

.endpoint-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.endpoint-card.gpt {
  border-color: #10a37f;
}

.endpoint-card.claude {
  border-color: #d97706;
}

.endpoint-card.gemini {
  border-color: #4285f4;
}

.endpoint-label {
  font-size: 1.1rem;
  font-weight: 700;
}

.endpoint-card.gpt .endpoint-label {
  color: #10a37f;
}

.endpoint-card.claude .endpoint-label {
  color: #d97706;
}

.endpoint-card.gemini .endpoint-label {
  color: #4285f4;
}

.endpoint-card code {
  font-size: 0.82rem;
  color: var(--vp-c-text-1);
  background: var(--vp-c-bg-mute);
  padding: 0.4em 0.8em;
  border-radius: 6px;
  word-break: break-all;
}

.setup-section {
  margin: 3rem auto;
  max-width: 960px;
  padding: 0 1.5rem;
}

.setup-section h2 {
  border-top: none;
  font-size: 1.8rem;
  font-weight: 700;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.desc {
  color: var(--vp-c-text-2);
  font-size: 1.1rem;
  margin-bottom: 1.5rem;
}

/* Install Card Styles */
.install-card {
  background: var(--vp-c-bg-soft);
  border: 1px solid var(--vp-c-divider);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.05);
  margin-bottom: 1rem;
}

.tabs {
  display: flex;
  background: var(--vp-c-bg-mute);
  border-bottom: 1px solid var(--vp-c-divider);
}
.tabs button {
  flex: 1;
  padding: 1rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--vp-c-text-2);
  background: transparent;
  border: none;
  cursor: pointer;
  transition: color 0.2s, background-color 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.tabs button:hover {
  color: var(--vp-c-text-1);
  background-color: var(--vp-c-bg-soft);
}
.tabs button.active {
  color: var(--vp-c-brand);
  background: var(--vp-c-bg-soft);
  box-shadow: inset 0 -2px 0 var(--vp-c-brand);
}

.code-block-wrapper {
  position: relative;
  padding: 1.5rem;
  text-align: left;
  display: flex;
  gap: 1rem;
  align-items: center;
}

.code-block {
  flex: 1;
  font-family: var(--vp-font-family-mono);
  font-size: 0.9rem;
  color: var(--vp-c-text-1);
  overflow-x: auto;
  white-space: pre;
  padding-right: 0.5rem;
  scrollbar-width: thin;
}
.code-block::-webkit-scrollbar {
  height: 6px;
}
.code-block::-webkit-scrollbar-thumb {
  background-color: var(--vp-c-divider);
  border-radius: 3px;
}

.copy-btn {
  flex-shrink: 0;
  padding: 0.5rem 1rem;
  border: 1px solid var(--vp-c-divider);
  border-radius: 6px;
  background: var(--vp-c-bg);
  color: var(--vp-c-text-1);
  font-size: 0.85rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}
.copy-btn:hover {
  border-color: var(--vp-c-brand);
  color: var(--vp-c-brand);
}
.copy-btn.copied {
  border-color: var(--vp-c-green);
  color: var(--vp-c-green);
  background-color: var(--vp-c-bg-mute);
}

.tip {
  font-size: 0.9rem;
  color: var(--vp-c-text-2);
}
.tip code {
  color: var(--vp-c-brand);
  background-color: var(--vp-c-bg-mute);
  padding: 0.2em 0.4em;
  border-radius: 4px;
}
</style>