> ## Documentation Index
> Fetch the complete documentation index at: https://docs.flowstep.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Flowstep MCP — Claude Code

> 将 Flowstep 连接到 Claude Code (CLI)，使用 Streamable HTTP MCP 传输。

## 配置

将服务器添加到你的 Claude Code 设置中。使用全局设置文件在所有地方启用它，或按项目添加。

<Tabs>
  <Tab title="全局 (~/.claude/settings.json)">
    ```json theme={"system"}
    {
      "mcpServers": {
        "flowstep-production": {
          "type": "http",
          "url": "https://api.flowstep.ai/mcp"
        }
      }
    }
    ```
  </Tab>

  <Tab title="项目 (.claude/settings.json)">
    ```json theme={"system"}
    {
      "mcpServers": {
        "flowstep-production": {
          "type": "http",
          "url": "https://api.flowstep.ai/mcp"
        }
      }
    }
    ```
  </Tab>
</Tabs>

或者，使用 CLI：

```bash theme={"system"}
claude mcp add --transport http flowstep-production https://api.flowstep.ai/mcp
```

## 身份验证

Claude Code 在第一次调用 Flowstep 工具时会自动处理 OAuth 2.1 PKCE 流程。你的浏览器会打开 `https://api.flowstep.ai/oauth/authorize`。使用你的 Flowstep 凭证登录，CLI 会捕获回调。

<Note>
  在身份验证之前，你需要一个 Flowstep 账户。在 [app.flowstep.ai](https://app.flowstep.ai) 上创建一个。
</Note>

## 验证连接

```bash theme={"system"}
claude mcp list
```

该服务器应该显示为已连接。然后在 Claude Code 会话中：

```
List my Flowstep files
```

## 使用示例

```
Create a Flowstep file called "Settings page", generate a desktop settings screen
for a developer tool with sections for API keys, notifications, and team members.
Show me the rendered image when done.
```