HTML / CSSAI大前端
VS Code Copilot 完整使用教程
详细介绍 GitHub Copilot 在 VS Code 中的安装配置与核心功能。内容涵盖智能代码补全、Agent 模式构建应用、内联聊天精确修改及自定义指令设置。通过实战任务管理应用演示，帮助用户掌握 AI 辅助编程技巧，提升开发效率。
详细介绍 GitHub Copilot 在 VS Code 中的安装配置与核心功能。内容涵盖智能代码补全、Agent 模式构建应用、内联聊天精确修改及自定义指令设置。通过实战任务管理应用演示，帮助用户掌握 AI 辅助编程技巧，提升开发效率。
GitHub Copilot 是一款集成在 Visual Studio Code 中的 AI 驱动编码助手，它基于公共代码仓库训练而成，能够支持大多数编程语言和框架。通过自然语言提示和现有代码上下文，Copilot 可提供实时代码建议、解释说明和自动化实现，显著提升开发效率。
不同用户类型需通过以下方式获取 Copilot 访问权限：
| 用户类型 | 访问方式说明 |
|---|---|
| 个人用户 | 注册 Copilot Free 免费计划（每月有限制）或付费订阅（无限使用），新用户可享受 30 天免费试用 |
| 组织/企业成员 | 通过组织管理员分配的订阅访问，或访问 GitHub 设置页面 申请组织提供的 Copilot 权限 |
活动栏 Accounts 菜单选择 Sign in with GitHub to use GitHub Copilot
Copilot 状态栏菜单选择 Sign in to use Copilot
切换账号（如需） 若需使用其他账号，通过活动栏的 Accounts 菜单登出当前账号
重新登录方式：
登录 GitHub 账号 选择 Sign in 登录账号（若未登录），无订阅用户将自动注册 Free 计划
启动设置向导 悬停状态栏中的 Copilot 图标，选择 Set up Copilot
工作区禁用：在扩展视图（⇧⌘X）中找到 GitHub Copilot，选择 禁用（工作区）并重启扩展
隐藏 AI 功能：通过命令面板（⇧⌘P）运行 Chat: Hide AI Features 完全隐藏 Copilot 功能
通过实战项目学习 Copilot 核心功能，本教程将创建一个包含添加、删除和标记任务功能的响应式网页应用。
如需切换多个建议，可悬停幽灵文本查看导航控件，或使用 ⌥]（下一个）和 ⌥[（上一个）快捷键循环选择
在 body 标签内继续输入：
<div class="container"><h1>My Task Manager</h1><form id="task-form">
输入 ，Copilot 会自动建议完整 HTML 结构（灰色幽灵文本）
代理模式能将自然语言需求转化为跨文件的完整实现：
输入以下指令并回车：
创建一个完整的任务管理器网页应用，支持添加、删除任务和标记完成状态。包含现代 CSS 样式，确保响应式设计。使用语义化 HTML 并保证可访问性。将标记、样式和脚本分离到各自文件。
在聊天模式下拉菜单中选择 Agent
内联聊天适用于对特定代码块进行精准修改：
内联聊天将专注于选中代码块进行针对性改进
输入以下指令：
添加输入验证以防止添加空任务，并去除任务文本中的空格
选中代码块后按 ⌘I 打开编辑器内联聊天
添加编码规范（示例）：
# 项目通用编码指南
## 代码风格
- 使用语义化 HTML5 元素（header, main, section 等）
- 优先使用现代 JavaScript (ES6+) 特性
## 命名规范
- 组件名、接口和类型别名使用 PascalCase
- 变量、函数和方法使用 camelCase
- 私有类成员以下划线 _ 为前缀
在聊天视图的模式下拉菜单中可选择此自定义模式
命名为 Code Reviewer，替换内容为：
--- description: '审查代码质量和最佳实践合规性'
tools: ['codebase', 'usages', 'vscodeAPI', 'problems']
---
# 代码审查模式
你是一名资深开发者，负责审查代码质量、最佳实践和项目标准合规性，不直接提供代码修改。
## 分析重点
- 代码质量、结构和最佳实践
- 潜在 bug、安全问题和性能问题
- 可访问性和用户体验考量
智能操作将 AI 功能无缝集成到 VS Code 界面，无需切换到聊天窗口：
点击提交框旁的 sparkle 图标，Copilot 将基于暂存更改生成符合规范的提交信息
通过本教程，你已掌握：
提示：使用 # 符号在聊天中引用特定文件（如 #index.html）或使用 #codebase 引用整个项目，可提供更精准的上下文建议。
微信公众号「极客日志」，在微信中扫描左侧二维码关注。展示文案：极客日志 zeeklog
生成新的随机RSA私钥和公钥pem证书。 在线工具，RSA密钥对生成器在线工具，online
基于 Mermaid.js 实时预览流程图、时序图等图表，支持源码编辑与即时渲染。 在线工具，Mermaid 预览与可视化编辑在线工具，online
将字符串编码和解码为其 Base64 格式表示形式即可。 在线工具，Base64 字符串编码/解码在线工具，online
将字符串、文件或图像转换为其 Base64 表示形式。 在线工具，Base64 文件转换器在线工具，online
将 Markdown（GFM）转为 HTML 片段，浏览器内 marked 解析；与 HTML 转 Markdown 互为补充。 在线工具，Markdown 转 HTML在线工具，online
将 HTML 片段转为 GitHub Flavored Markdown，支持标题、列表、链接、代码块与表格等；浏览器内处理，可链接预填。 在线工具，HTML 转 Markdown在线工具，online