用 VS Code 写前端页面时，我最不喜欢的操作之一，就是每改一行 HTML 都要切到浏览器按一次刷新。
使用 AI 编程助手后，另一个问题也越来越明显：同一个 Claude 会话里，到底消耗的是 Anthropic API Key，还是 GitHub Copilot 订阅额度？
2026年8月12日发布的 VS Code 1.133，正好针对这两类问题做了更新。VS Code 1.133 官方发布说明
这次没有几十项花哨功能，真正值得普通开发者关注的主要是：
- Claude 会话可以逐轮切换模型来源；
- 已配置 Claude 凭据时，可免 GitHub 登录打开 Agents 窗口；
- 长对话中的提示词可以固定在顶部；
- 本地 HTML 在集成浏览器中保存后自动刷新。
先说结论：前三项更偏 AI 编程工作流，最后一项即使完全不用 AI，也值得前端初学者开启。
先检查自己是不是1.133
在 VS Code 中打开：
帮助 → 关于确认版本不低于：
1.133如果仍是旧版本，打开：
帮助 → 检查更新官方说明此次更新采用逐步推送。如果暂时没有自动收到，可以主动执行"检查更新"，或者从 VS Code 官网 下载新版安装包覆盖安装。
升级完成后建议重新启动 VS Code。
Agent Host 到底是什么
这次几个 AI 功能都与 Agent Host 有关。
过去很多 AI 会话依附在 VS Code 扩展进程中。现在 VS Code 可以把 Claude、Copilot、Codex 等编程代理运行在一个独立的 Agent Host 进程里。
这样做的主要价值是：
- 同一个会话可以出现在多个 VS Code 窗口；
- 关闭编辑器窗口后，正在运行的代理任务不必立即结束；
- Claude、Copilot、Codex 可以使用较统一的会话界面；
- 本地、远程和独立工作树任务更容易管理；
- AI 任务不容易被繁忙的扩展进程阻塞。
Agent Host 和相关协议仍在持续开发，并不代表所有功能都已经完全稳定。VS Code Agent Host 官方架构说明
可以在用户级 settings.json 中明确启用：
{
"chat.agentHost.enabled": true,
"chat.agentHost.allowSignedOutWhenUsable": true,
"chat.stickyScroll.enabled": true,
"workbench.browser.autoReloadOnFileChange": true
}Windows 用户可以按：
Ctrl+Shift+P搜索并打开：
Preferences: Open User Settings (JSON)再把配置合并进去。
不要直接覆盖原来的整个文件，也不要在最后一项后面多写逗号。这份配置已经通过标准 JSON 解析检查。
同一个 Claude 会话可以逐轮切换模型
以前创建 Claude 会话时，需要在两种来源中选择一种：
- 使用 Anthropic API Key 或 Claude Code OAuth；
- 通过 GitHub Copilot 订阅使用模型。
切换来源通常需要重新配置 Agent Host。
VS Code 1.133 将两组模型同时放进模型选择器中。现在可以在同一个 Claude 会话里，第一轮选择 Anthropic 模型，下一轮再切换到 Copilot 提供的模型。
这里必须理解一个费用边界：
| 模型分组 | 身份验证 | 使用费用 |
|---|---|---|
| Anthropic | API Key或Claude Code OAuth | 由Anthropic计费 |
| Copilot | GitHub账号和Copilot订阅 | 消耗Copilot订阅额度 |
模型选择只影响下一轮对话，并不会把整个会话永久切换到某个计费渠道。
因此看到"Claude 会话"四个字，不能直接判断费用来自哪里。提交提示词前，最好再看一眼当前模型所在的分组。
尤其是准备让 AI 扫描大型项目、运行长时间测试或反复修改代码时，模型选错可能带来意外的 API 消耗。
如何免 GitHub 登录使用 Claude
这是1.133最容易被误解的功能。
"免登录"指的是：
免 GitHub 登录并不是不需要任何账号、凭据或者付费方式。
使用前必须满足：
- 已启用 Agent Host；
- 电脑中存在可被 VS Code 发现的 Claude 配置；
- 已配置 Anthropic API Key 或 Claude Code OAuth Token；
- 开启
chat.agentHost.allowSignedOutWhenUsable； - 当前选择的是 Claude，而不是 Copilot或Codex。
官方提供的一种配置方式，是在下面的位置创建 Claude 用户设置：
%USERPROFILE%\.claude\settings.json内容结构如下：
{
"env": {
"ANTHROPIC_API_KEY": "<填写自己的API Key>"
}
}请不要把真实密钥复制到文章、截图或聊天记录里，也不要把包含密钥的文件提交到 Git 仓库。
如果已经使用 Claude Code，还可以通过 Claude Code OAuth Token 进行身份验证。官方说明支持使用：
CLAUDE_CODE_OAUTH_TOKEN并通过下面的命令创建令牌：
claude setup-token凭据准备好以后，打开命令面板：
Ctrl+Shift+P执行：
Chat: Open Agents Window也可以在 PowerShell 中运行：
code --agents如果 VS Code 成功识别 Claude 配置，Agents 窗口可以在不登录 GitHub 的情况下打开，模型选择器只显示使用 Anthropic 凭据的模型。
官方将这项功能标记为实验性功能，目前只支持 Claude。VS Code Agents窗口官方说明
如果使用 Codex 时仍然出现 GitHub 登录或其他身份验证提示，不代表配置失败。VS Code 1.133 并没有宣布 Codex 已经支持同样的免 GitHub 登录流程。
Agents窗口仍然要求登录怎么办
可以按照下面的顺序排查：
1. 检查设置是否开启
确认用户设置中存在：
"chat.agentHost.allowSignedOutWhenUsable": true2. 检查Agent Host
确认：
"chat.agentHost.enabled": true修改后完全关闭并重新打开 VS Code。
3. 检查Claude支持
在设置中搜索：
github.copilot.chat.claudeAgent.enabled确认没有被手动关闭。
4. 检查Claude凭据
如果 VS Code 没有发现 Anthropic API Key 或 Claude Code OAuth Token，它仍然会显示原来的 GitHub 登录界面。
5. 检查选择的代理
免登录功能目前只适用于 Claude。选择 Copilot、Codex或需要 GitHub 能力的操作时，VS Code仍可能要求登录。
长对话终于不容易看串了
AI 编程对话一长，很容易出现一个问题：
向上滚动查看回答时，已经不知道当前回答对应的是哪一轮提示词。
VS Code 1.133 增加了提示词 Sticky Scroll。开启后，滚动经过的提示词会固定在聊天窗口顶部，并显示它在整个会话中的位置。
设置项为：
"chat.stickyScroll.enabled": true固定区域还提供上一条、下一条提示词按钮，可以在长对话之间快速跳转。
这个功能看起来不大，但在下面几种任务中特别实用：
- 让 AI 连续排查多个报错；
- 先分析、再修改、最后执行测试；
- 一个会话中多次调整需求；
- 同时比较多个修复方案；
- 回头检查 AI 是否遗漏了早期限制。
建议每一轮提示词都明确写出当前目标。例如：
本轮只分析控制台报错，不修改代码。下一轮再写：
按照上一轮确认的根因进行最小修改，
不要更换依赖版本。提示词被固定在顶部后，AI 当前究竟被授权做什么会清楚很多。
HTML保存后自动刷新
对于刚学 HTML、CSS 的开发者，这可能是本次更新最直接的效率提升。
以前在 VS Code 集成浏览器中打开本地 HTML，修改并保存文件后，通常还需要手动刷新预览。
1.133增加了：
"workbench.browser.autoReloadOnFileChange": true当本地 HTML 文件在集成浏览器中打开，并且文件内容发生变化时，预览页面会自动刷新。
可以新建一个 index.html 测试：
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta
name="viewport"
content="width=device-width, initial-scale=1.0"
>
<title>自动刷新测试</title>
<style>
body {
min-height: 100vh;
display: grid;
place-items: center;
margin: 0;
background: #07111f;
color: #e6f3ff;
font-family: system-ui, sans-serif;
}
main {
width: min(560px, 80vw);
padding: 40px;
border: 1px solid #1b81c4;
border-radius: 18px;
background: #0c1d32;
}
p {
color: #4ac7ff;
}
</style>
</head>
<body>
<main>
<h1>保存后不需要手动刷新</h1>
<p>把这句话改掉，再按 Ctrl+S。</p>
</main>
</body>
</html>然后：
- 在资源管理器中右键
index.html； - 选择
Open in Integrated Browser； - 修改
<p>中的文字； - 按
Ctrl+S保存； - 观察集成浏览器是否自动更新。
也可以按：
Ctrl+Shift+P运行：
Open Integrated Browser这项功能针对的是 VS Code 集成浏览器，不会让外部 Chrome、Edge 浏览器自动刷新。
它也不能完全替代 Vite、Webpack、Next.js 等开发服务器提供的热更新。对于 React、Vue 等项目，仍然应该使用框架自己的开发命令。
此外，官方描述的是本地 HTML 文件变化后刷新。不要直接推断为所有关联的 CSS、JavaScript 文件变化都一定会触发相同行为。
AI修改页面后的实用工作流
这次更新可以组合成一个比较顺手的前端流程：
创建Claude会话
→ 选择当前轮次使用的模型
→ 让AI修改本地HTML
→ 集成浏览器自动刷新
→ 人工检查页面
→ 查看Git Diff
→ 再决定是否接受可以给 Claude 这样的提示词：
检查当前 index.html 的结构和移动端布局。
要求：
1. 先说明发现的问题；
2. 不增加第三方依赖；
3. 保留现有文字内容；
4. 只修改 index.html；
5. 修改后打开集成浏览器检查页面；
6. 最后列出实际修改的位置。如果项目已经进入正式开发阶段，建议再加一句：
不要使用危险的跳过权限模式，
运行命令前先说明用途。不建议打开危险跳过权限
VS Code 提供了一个权限相关设置：
github.copilot.chat.claudeAgent.allowDangerouslySkipPermissions名称里已经明确出现 Dangerously。
开启后，Claude可能跳过工具和操作的权限检查。官方建议只在没有网络访问的隔离沙箱中使用。VS Code Agent Harness官方说明
普通本地项目不建议开启。
即使使用新的 Agent Host，也应该继续保持这些习惯：
- 执行前提交或备份重要代码；
- 大型任务优先使用独立 Git Worktree；
- 不允许 AI 随意读取
.env和密钥文件； - 修改后检查 Git Diff；
- 不把测试通过等同于业务逻辑正确；
- 不在生产服务器上直接尝试实验性功能。
这次更新最值得谁升级
如果平时完全不用 AI，只写后端代码，1.133的吸引力可能没有那么强。
但下面几类用户建议升级：
- 在 VS Code 中使用 Claude、Copilot或Codex；
- 想使用 Claude，但不想强制登录 GitHub；
- 经常进行很长的 AI 编程对话；
- 学习 HTML、CSS 和 JavaScript；
- 需要频繁预览 AI 修改后的网页；
- 同时使用 Anthropic API和Copilot订阅，需要区分费用来源。
我认为最实用的并不是"又接入了一个新模型"，而是模型计费边界、会话阅读和网页验证终于更清楚了。
AI 写代码的速度已经不慢，真正浪费时间的是上下文混乱、费用来源不明，以及修改完成后还要人工重复执行刷新和验证操作。
需要了解相关会员充值服务时，gpt68.com 可作为第三方 AI 会员充值平台参考，但它不是 VS Code、GitHub、Anthropic 或 OpenAI 的官方网站或授权合作方。