为网页 AI 提供本地编码能力。
通过 VS Code 插件与浏览器插件，打破网页 AI 与本地项目之间的边界，使 ChatGPT、Gemini、DeepSeek 等网页 AI 连接到本地 VS Code，获得读写文件、运行命令的能力，还支持 MCP 和 Skills。
中文 | English
下面是本次录屏演示中通过 webcode 连接 DeepSeek 网页版生成的 SVG，任务是绘制一只骑自行车的鹈鹕，也称为“鹈鹕测试”。
提示词：
Generate an SVG of a pelican riding a bicycle.
操作演示（1.5 倍速）
pelican-bicycle-deepseek-1.5x.mp4
生成结果
- 打开 VS Code 扩展商店。
- 搜索
webcode gateway。 - 安装扩展。
-
在 VS Code 中打开一个具体文件夹或工作区。
-
点击 VS Code 右下角状态栏里的
webcode: 关闭。
-
在弹出的菜单里点击
启动 webcode。 -
等待状态栏文字变成
webcode: <端口>。
当状态栏显示端口号时，说明本地 Gateway 已经启动。
- 在启动菜单里选择目标站点，例如
Open ChatGPT或其他支持的入口。 - webcode 默认会用
Edge 独立保活模式打开 Microsoft Edge。 - 独立 Edge profile 会自动加载内置的 webcode bridge。
- 桥接页会自动与本地 Gateway 完成握手。
- 握手成功后，浏览器会自动跳转到对应的 AI 站点。
首次使用时，需要在这个独立 Edge profile 中登录一次目标 AI 站点。当 bridge 显示 ON 时，表示连接已经可以使用。
- 打开目标 AI 站点中的新对话。
- 先输入你的实际需求，再在同一条消息末尾添加
/webcode或@webcode，或者直接回车。 - 当 webcode 询问是否添加初始化上下文时，点击
添加或按 Enter。 - webcode 会把触发词替换为完整初始化上下文。确认消息内容后，由你手动发送。
如果初始化上下文超过当前 AI 站点的输入框限制，webcode 会优先把完整上下文作为 txt 附件添加到消息中，并在输入框里保留一段简短说明。
例如：
读取 src/utils.ts，然后为它补一个单元测试。 /webcode列出当前工作区的文件结构。 @webcode把项目文档生成到 docs 目录里。 /webcode
webcode 内置 read_file、attach_file、write_file、edit_file、search_files、search_code、execute_command、run_in_terminal、terminal_session 等本地工具，用于文本读取、TXT/图片/PDF 附件投递、文件写入、代码搜索、命令执行和终端会话管理。
具体工具清单见 内置工具说明。
需要接入浏览器自动化、GitHub、数据库或其他外部能力时，可以通过 webcodeGateway.servers 配置第三方 MCP server。
具体配置方式见 MCP 服务配置指南。
webcode 可以把当前 VS Code 工作区中的本地 Skills 暴露给网页 AI，让模型按需读取项目工作流、模板、领域说明或脚本资源。
具体使用方式见 Skills 使用指南。
初始化时，webcode 会从 VS Code 当前打开的主工作区根目录读取项目规则文件，并随初始化结果发送给网页 AI：
USER_RULES.mdAGENTS.md或CLAUDE.md
如果 AGENTS.md 和 CLAUDE.md 同时存在，只发送 AGENTS.md。浏览器扩展不再提供单独的个性化指令设置页。
webcode 目前已内置支持以下 AI 平台：
- ChatGPT
- Gemini
- Google AI Studio
- DeepSeek
- GLM
- Claude
- Qwen
如需支持其他平台，可以通过 VS Code 配置快速接入新的站点。稳定平台可以加入内置站点列表，实验或私有站点通常只需要配置 webcodeGateway.aiSites。
具体步骤见 站点支持扩展指南。
源码下载、依赖安装、打包脚本、产物说明和本地安装方式见 构建指南。
首次启动环境、触发词无反应、工具调用执行后页面没有变化、查看历史工具调用等问题见 常见问题。
欢迎提交 Issue 和 Pull Request。
感谢 LINUX DO 社区提供技术交流与开源分享的平台。