> ## 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 — Windsurf

> 使用 Streamable HTTP MCP 传输将 Flowstep 连接到 Windsurf。

## 配置

编辑 `~/.codeium/windsurf/mcp_config.json`：

```json theme={"system"}
{
  "mcpServers": {
    "flowstep": {
      "serverUrl": "https://api.flowstep.ai/mcp"
    }
  }
}
```

保存后重启 Windsurf。

## 身份验证

首次使用时，Windsurf 会打开您的浏览器进入 Flowstep OAuth 登录页面。使用您的 Flowstep 凭证（电子邮件/密码或 Google SSO）登录，Windsurf 将存储令牌。

<Note>
  连接前需要一个 Flowstep 账户。访问 [app.flowstep.ai](https://app.flowstep.ai) 创建一个账户。
</Note>

## 验证连接

在 Windsurf 中打开 MCP 面板并确认 Flowstep 已列出。在 Cascade 聊天中：

```
List my Flowstep files
```

## 使用示例

```
Create a Flowstep file called "Empty states", then generate a mobile empty-state screen
for a task list app with an illustration placeholder and a call-to-action button.
Show me the rendered result.
```