VS Code 1.122：离线也能跑自己的大模型，浏览器里直接测响应式

预计阅读时间：8 分钟

VS Code 1.122 把两件开发者高频要做的事推到了编辑器内部：一是用自己部署的大模型写代码，二是看页面在不同屏幕上的表现。前者通过 Air-gapped BYOK 让你断网也能调用本地模型，后者用浏览器设备模拟把"开 Chrome DevTools 切设备"的流程收进了 VS Code。再加上更丰富的问题报告机制，这个版本在"编辑器即工作台"这条路上又踩实了一步。

Air-gapped BYOK：断网也能用自建模型

之前的 BYOK（Bring Your Own Key）要求 VS Code 能联网验证 API Key 或访问远端推理服务。1.122 新增的 Air-gapped 模式，意味着你可以指向一个完全在内网运行的推理端点——Ollama、vLLM、TGI 都行——VS Code 不再强制外网连通性检查。

这对以下场景直接有用：

企业内网开发环境，出外网需审批
现场部署/军工/金融等离线环境
想用本地 GPU 跑模型但不想走公网 API

配置方式在 settings.json 里完成。下面是一个指向本地 Ollama 的完整示例：

// ~/.vscode/settings.json 或工作区 .vscode/settings.json
{
  // 开启 air-gapped 模式，跳过外网连通性检查
  "github.copilot.chat.experimental.agentMode": true,

  // 指定自定义模型端点（内网地址，无需外网）
  "github.copilot.advanced.modelEndpoint": "http://localhost:11434/v1/chat/completions",

  // 使用 OpenAI 兼容协议的本地模型
  "github.copilot.advanced.modelProvider": "openai-compatible",

  // 模型名称，对应 Ollama 里已拉取的模型
  "github.copilot.advanced.modelName": "deepseek-coder-v2:16b",

  // 关闭遥测，彻底离线
  "github.copilot.telemetry.enabled": false
}

运行前确保：

Ollama 已启动且模型已拉取：ollama pull deepseek-coder-v2:16b
端口 11434 在本机可访问，可用 curl http://localhost:11434/v1/models 验证
如果是团队内网共享的推理服务，把 localhost 替换成内网 IP 即可

Air-gapped 的代价也很直白：你只能用自己能跑起来的模型，参数量和推理速度取决于本地硬件。16B 模型在一张 3090 上大概 15-20 tokens/s，写日常函数够用，做大规模重构会慢。选模型时在质量和速度之间取一个你硬件能撑住的平衡点。

浏览器设备模拟：不用离开编辑器测响应式

以前测响应式，流程是：写代码 → 开浏览器 → F12 → 切设备模拟 → 看效果 → 回编辑器改 → 再刷新。1.122 把中间的"开浏览器 + 切设备"收进了 VS Code 的集成浏览器预览，直接在编辑器内选择设备 profile 查看页面表现。

支持的范围覆盖了常见移动端和桌面设备：iPhone SE / 14 Pro、Pixel 5 / 7、Galaxy S8 / S20、iPad Mini / Air / Pro，以及各种桌面分辨率组合。

用一个最小示例来体验这个功能。先创建测试页面：

<!-- test-responsive.html -->
<!DOCTYPE html>
<html lang="zh">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>响应式测试页</title>
  <style>
    .card-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
      gap: 16px;
      padding: 16px;
    }
    .card {
      border: 1px solid #e0e0e0;
      border-radius: 8px;
      padding: 16px;
      background: #fafafa;
    }
    .card h3 { margin: 0 0 8px; font-size: 1.1rem; }
    .card p  { margin: 0; color: #666; font-size: 0.9rem; }
  </style>
</head>
<body>
  <div class="card-grid">
    <div class="card"><h3>功能 A</h3><p>桌面三列，平板两列，手机单列</p></div>
    <div class="card"><h3>功能 B</h3><p>随屏幕宽度自动重排</p></div>
    <div class="card"><h3>功能 C</h3><p>minmax(280px, 1fr) 控制下限</p></div>
    <div class="card"><h3>功能 D</h3><p>第四张卡片在窄屏下独占一行</p></div>
  </div>
</body>
</html>

操作步骤：

在 VS Code 中打开这个 HTML 文件
右键选择 Open in Integrated Browser（或用命令面板搜索 Simple Browser: Show）
在集成浏览器右上角的设备下拉框中选择目标设备，比如 iPhone SE (375×667) 或 iPad Pro (1024×1366)
观察卡片网格在不同宽度下的列数变化
修改 CSS 中的 minmax(280px, 1fr) 参数，编辑器里改完直接刷新预览即可

这比外部浏览器省掉了来回切换窗口的成本。不过集成浏览器目前不支持 DevTools 级别的 DOM 审查和网络面板，复杂调试仍需切到完整浏览器。它最适合的场景是快速验证布局断点和视觉还原，而不是深度排查渲染 bug。

更丰富的问题报告：截图 + 录屏一步打包

1.122 改进了 VS Code 内置的 Issue Reporter。之前报告 bug 只能填文字描述，现在可以直接在报告里附加屏幕截图和屏幕录制视频。

这意味着：

复现步骤不再靠文字脑补，直接录一段操作过程
UI 异常不用手动截图再粘贴，从编辑器内直接捕获
报告内容更完整，维护者能更快定位问题

触发方式：命令面板输入 Help: Report Issue，在打开的报告窗口中会看到新增的 Attach Screenshot 和 Attach Screen Recording 按钮。

采纳建议与取舍

功能	适合谁	注意点
Air-gapped BYOK	内网开发、本地有 GPU、不想走公网 API	模型质量受本地硬件限制；推理慢时体验会打折
浏览器设备模拟	前端开发者日常验证响应式布局	缺 DevTools 深度审查能力，复杂调试仍需外部浏览器
丰富问题报告	所有遇到 VS Code bug 想上报的人	录屏文件体积大，注意不要附带敏感信息

如果你已经在用 Ollama 或 vLLM 跑本地模型，升级到 1.122 后把 modelEndpoint 指向内网地址、开启 air-gapped，就能在断网环境下继续用 Copilot Chat 写代码。前端开发者则可以把日常的响应式验证流程收进编辑器，减少窗口切换。两个功能各自解决一个具体的摩擦点，不花哨但实用。

VS Code 1.122：离线也能跑自己的大模型，浏览器里直接测响应式

Air-gapped BYOK：断网也能用自建模型

浏览器设备模拟：不用离开编辑器测响应式

更丰富的问题报告：截图 + 录屏一步打包

采纳建议与取舍

相关推荐

建议反馈