From b6199c748bfee1bf01df29eed5164bbee9096eea Mon Sep 17 00:00:00 2001 From: Kayla Cinnamon Date: Thu, 21 May 2026 17:57:58 -0400 Subject: [PATCH 1/3] Initial docs --- learn/agents/1-using-tools-with-agents.md | 88 +++++++++++++++++ .../2-extending-agents-with-mcp-servers.md | 99 +++++++++++++++++++ learn/agents/3-agent-plugins.md | 90 +++++++++++++++++ .../4-using-third-party-agents-in-vs-code.md | 81 +++++++++++++++ learn/toc.json | 11 +++ 5 files changed, 369 insertions(+) create mode 100644 learn/agents/1-using-tools-with-agents.md create mode 100644 learn/agents/2-extending-agents-with-mcp-servers.md create mode 100644 learn/agents/3-agent-plugins.md create mode 100644 learn/agents/4-using-third-party-agents-in-vs-code.md diff --git a/learn/agents/1-using-tools-with-agents.md b/learn/agents/1-using-tools-with-agents.md new file mode 100644 index 0000000000..96edac1f8f --- /dev/null +++ b/learn/agents/1-using-tools-with-agents.md @@ -0,0 +1,88 @@ +--- +ContentId: 5d7a2a1e-9f1c-4d2a-8c6a-1c2a8f7d4a01 +DateApproved: 05/21/2026 +MetaDescription: Learn how to use built-in tools, MCP tools, extension tools, approvals, and sandboxing with agents in VS Code. +MetaSocialImage: ../images/shared/agent-first-development-social.png +Keywords: + - copilot + - agents + - tools + - tool sets + - approvals + - sandboxing +--- + +# Using tools with agents + +Tools give agents in VS Code access to the workspace, the web, APIs, and other capabilities they need to finish real tasks. This course shows how to choose tools, group them into tool sets, and keep agent work safe with approvals and sandboxing. + +## Prerequisites + +Before you start, install VS Code and sign in to GitHub Copilot. You also need access to the tools you want to use, such as MCP servers or extensions that contribute tools. + +## What tools do + +Agents use tools to search code, read files, run commands, fetch content, and call services. VS Code supports three kinds of tools: + +* Built-in tools, such as read, edit, search, execute, and web. +* MCP tools from installed Model Context Protocol servers. +* Extension tools contributed by VS Code extensions. + +The agent selects tools from the enabled set based on your prompt and context. If you want to force a specific tool, type `#` and the tool name in chat. + +## Choose the right tools + +Open the Chat view, switch to **Agent**, and use the **Configure Tools** button in the chat input to choose the tools for the current session. + +Select only the tools you need. A smaller tool set gives the model less to sort through and usually leads to better results. + +![Screenshot showing the Chat view with the Configure Tools button in the chat input.](../../docs/copilot/images/chat-tools/agent-mode-select-tools.png) + +> [!TIP] +> Start with the fewest tools that can complete the task, then add more only when the agent needs them. + +## Group related tools with tool sets + +Tool sets let you save related tools as a single reusable group. You can use them in chat prompts, prompt files, and custom agents. + +Create a tool set from the Command Palette with **Chat: Configure Tool Sets**. Then add the tools you want in the generated `.jsonc` file. + +Use tool sets when you want a repeatable setup for a task such as Python work, web research, or repository changes. + +## Manage approvals + +The permissions picker controls how much autonomy the agent has during a session. + +* **Default Approvals** asks before sensitive actions. +* **Bypass Approvals** auto-approves tool calls. +* **Autopilot** (Preview) auto-approves tool calls and continues working until the task is done. + +You can keep your preferred mode across sessions with `setting(chat.permissions.default)`. Autopilot is available when `setting(chat.autopilot.enabled)` is on. + +> [!CAUTION] +> Higher autonomy levels reduce the amount of review you do before tools run. Use them with care, especially when the agent can edit files or run terminal commands. + +![Screenshot of a tool confirmation dialog showing tool details and approval options.](../../docs/copilot/images/chat-tools/chat-approve-tool.png) + +## Use sandboxing for risky commands + +Agent sandboxing adds OS-level isolation for terminal commands run by the agent. It limits file system and network access, and sandboxed commands are auto-approved because they already run in a controlled environment. + +Enable it with `setting(chat.agent.sandbox.enabled)`. On macOS and Linux, you can choose full isolation or file system isolation with network access. + +Sandboxing is a good fit for tasks that need terminal access but should not reach beyond the workspace or approved domains. + +## Why this matters + +The right tool mix keeps agents focused. A smaller set reduces noise, while approvals and sandboxing help you keep control when the agent can make changes or reach outside the workspace. + +## What's next + +Now that you know how to use tools, the next course shows how MCP servers add external data and actions to an agent session. + +## Learn more + +* [Use tools with agents](https://code.visualstudio.com/docs/copilot/agents/agent-tools) +* [Tools concepts](https://code.visualstudio.com/docs/copilot/concepts/tools) +* [Agent sandboxing](https://code.visualstudio.com/docs/copilot/concepts/trust-and-safety#agent-sandboxing) +* [Agent approvals and permissions](https://code.visualstudio.com/docs/copilot/agents/agent-tools#permission-levels) diff --git a/learn/agents/2-extending-agents-with-mcp-servers.md b/learn/agents/2-extending-agents-with-mcp-servers.md new file mode 100644 index 0000000000..4d9a06381f --- /dev/null +++ b/learn/agents/2-extending-agents-with-mcp-servers.md @@ -0,0 +1,99 @@ +--- +ContentId: 7a2e1d9c-4b8f-4a3d-8e0c-2f5d6b7c8a02 +DateApproved: 05/21/2026 +MetaDescription: Learn how MCP servers extend agents in VS Code with tools, resources, prompts, and apps. +MetaSocialImage: ../images/shared/agent-first-development-social.png +Keywords: + - mcp + - model context protocol + - agents + - tools + - api + - customization +--- + +# Extending agents with MCP servers + +MCP servers connect agents to external tools and data sources. In VS Code, they extend an agent with capabilities such as file operations, database access, API calls, resources, and prompts. + +This course shows how to install an MCP server, configure it in your workspace or user profile, secure it with sandboxing, and manage it from VS Code. + +## Prerequisites + +Before you start, install VS Code and sign in to GitHub Copilot. You also need access to an MCP server or the ability to add one from the marketplace. + +## What MCP adds + +Model Context Protocol is built around three primitives: + +* **Tools**: actions the agent can invoke. +* **Resources**: context the agent can read. +* **Prompts**: reusable prompt templates that standardize interactions. + +That combination turns MCP into a flexible way to ground agents in external systems. + +## Install an MCP server + +Use the Extensions view and search for `@mcp` to browse the MCP server gallery. From there, you can install a server in your user profile or in your workspace. + +When you install a server, VS Code writes the configuration into `mcp.json` and discovers the server's tools for use in chat. + +![Screenshot showing the MCP servers in the Extensions view.](../../docs/copilot/images/mcp-servers/extensions-view-mcp-servers.png) + +## Configure MCP servers + +There are two common configuration scopes: + +* **Workspace**: `.vscode/mcp.json` +* **User profile**: the user-level `mcp.json` file + +Use workspace configuration when you want a server tied to a project. Use user profile configuration when you want the server available across workspaces. + +You can also add a server through **MCP: Add Server** or open the user configuration with **MCP: Open User Configuration**. + +> [!TIP] +> VS Code provides IntelliSense and inline actions for `mcp.json`, which makes it easier to start, stop, and inspect servers. + +![MCP server configuration with lenses to manage server.](../../docs/copilot/images/mcp-servers/mcp-server-config-lenses.png) + +## Use an MCP server in chat + +Once a server is installed and enabled, open Chat, switch to **Agent**, and select the server's tools in the tools picker. + +The agent can then call the server's tools when your prompt needs external context or actions. For example, an MCP server can ground a question in product documentation or call a browser tool to work with a web page. + +## Secure MCP servers + +Treat local MCP servers as code that can run on your machine. Review the publisher and configuration before you install one. + +For local stdio servers on macOS and Linux, you can enable sandboxing to restrict file system and network access. Sandboxed servers are auto-approved because they already run in a controlled environment. + +If a server needs more access, update the sandbox rules instead of widening access for the whole machine. + +![Screenshot showing the MCP server trust prompt.](../../docs/copilot/images/mcp-servers/mcp-server-trust-dialog.png) + +## Manage MCP servers + +You can manage servers from several places in VS Code: + +* The Extensions view. +* The `mcp.json` editor. +* The Command Palette. +* The Agent Customizations view. + +Use these surfaces to start or stop a server, inspect output, and install additional servers from the marketplace. + +## Why this matters + +MCP gives agents a standard way to reach outside the model and work with the systems you already use. That means less ad hoc prompting and more repeatable workflows. + +## What's next + +Next, you will see how agent plugins package skills, agents, hooks, and MCP servers into a single installable bundle. + +## Learn more + +* [Add and manage MCP servers in VS Code](https://code.visualstudio.com/docs/copilot/customization/mcp-servers) +* [MCP configuration reference](https://code.visualstudio.com/docs/copilot/reference/mcp-configuration) +* [MCP sandbox configuration](https://code.visualstudio.com/docs/copilot/reference/mcp-configuration#sandbox-configuration) +* [Use tools with agents](https://code.visualstudio.com/docs/copilot/agents/agent-tools) diff --git a/learn/agents/3-agent-plugins.md b/learn/agents/3-agent-plugins.md new file mode 100644 index 0000000000..aeb165f353 --- /dev/null +++ b/learn/agents/3-agent-plugins.md @@ -0,0 +1,90 @@ +--- +ContentId: 9c8b7a6d-5e4f-4c3b-9a2d-1f0e2d3c4b05 +DateApproved: 05/21/2026 +MetaDescription: Learn how agent plugins bundle commands, skills, agents, hooks, and MCP servers in VS Code. +MetaSocialImage: ../images/shared/agent-first-development-social.png +Keywords: + - plugins + - agents + - skills + - hooks + - mcp + - customization +--- + +# Agent plugins + +Agent plugins bundle multiple customizations into one installable package. Instead of setting up each capability separately, you can install a plugin that brings commands, skills, custom agents, hooks, and MCP servers into VS Code together. + +This course shows how to install plugins, browse available collections, use plugin-provided tools, and share recommended plugins with your team. + +## Prerequisites + +Before you start, install VS Code and sign in to GitHub Copilot. Then enable support for agent plugins in your settings. + +## What plugins provide + +A plugin can include any combination of: + +* Slash commands. +* Agent skills. +* Custom agents. +* Hooks. +* MCP servers. + +That makes plugins useful for sharing a team workflow or adopting a prebuilt package of agent behavior. + +## Install and manage plugins + +Enable plugin support in the settings, then open the Agent Customizations view from the Chat view to browse available plugins. + +From there, you can: + +* Browse the marketplace. +* Install a plugin from source. +* Create your own plugin. +* Review which customizations are already installed. + +After installation, the plugin's customizations appear alongside your local ones. + +![Screenshot of browsing agent plugins in the Extensions sidebar.](../../docs/copilot/images/agent-plugins/extensions-view.png) + +![Screenshot of the Agent Plugins - Installed view in the Extensions view.](../../docs/copilot/images/agent-plugins/installed-plugins.png) + +## Use plugin-provided customizations + +Plugins can expose custom agents, skills, and MCP servers all in one place. In chat, you can invoke plugin content with slash commands or by selecting the relevant customization from the picker. + +That makes plugins useful when you want a single install to add a complete workflow, such as a testing package that includes a testing skill, a review agent, and an MCP server for reporting. + +![Screenshot of the Agent Customizations editor showing installed plugin content.](../../docs/copilot/images/customization/chat-customizations-editor.png) + +> [!CAUTION] +> Plugins can run hooks and MCP servers on your machine. Review the contents and publisher before you install one. + +## Plugin structure + +Plugins are defined by a `plugin.json` manifest and can point to folders for skills, agents, hooks, and MCP server definitions. That keeps related automation in one package and makes it easier to share across a team. + +## Share recommended plugins + +If you want to recommend plugins for your team, add a shared plugin marketplace configuration to your repository and commit it. That lets teammates browse the same recommended sources and install the same collections in their own workspaces. + +Use this approach when you want consistent tooling across a team without forcing a plugin into every workspace. + +## Why this matters + +Plugins turn a set of related customizations into one package. That makes it easier to share a workflow, install a collection once, and keep teammates aligned on the same agent behavior. + +## What's next + +The last course in this series shows how to use third-party agents like Claude and Codex without leaving VS Code. + +## Learn more + +* [Agent plugins in VS Code](https://code.visualstudio.com/docs/copilot/customization/agent-plugins) +* [Customize AI in Visual Studio Code](https://code.visualstudio.com/docs/copilot/concepts/customization) +* [Use agent skills in VS Code](https://code.visualstudio.com/docs/copilot/customization/agent-skills) +* [Use custom agents in VS Code](https://code.visualstudio.com/docs/copilot/customization/custom-agents) +* [Use hooks in VS Code](https://code.visualstudio.com/docs/copilot/customization/hooks) +* [Add and manage MCP servers in VS Code](https://code.visualstudio.com/docs/copilot/customization/mcp-servers) diff --git a/learn/agents/4-using-third-party-agents-in-vs-code.md b/learn/agents/4-using-third-party-agents-in-vs-code.md new file mode 100644 index 0000000000..5445bbf665 --- /dev/null +++ b/learn/agents/4-using-third-party-agents-in-vs-code.md @@ -0,0 +1,81 @@ +--- +ContentId: 1e2d3c4b-5a6f-4d7e-8c9b-0a1b2c3d4e06 +DateApproved: 05/21/2026 +MetaDescription: Learn how to use third-party agents like Claude and Codex in VS Code with your GitHub Copilot subscription. +MetaSocialImage: ../images/shared/agent-first-development-social.png +Keywords: + - third-party agents + - claude + - codex + - agents + - copilot + - preview +--- + +# Using third-party agents in VS Code + +Third-party agents let you use provider-specific agent experiences inside VS Code while keeping your work in the same editor and session flow. This course introduces the available agent types, how to start a session, and what to watch for when you use them. + +## Prerequisites + +Before you start, install VS Code and sign in to GitHub Copilot. For cloud partner agents, make sure they are enabled in your GitHub Copilot settings. For Codex, install the OpenAI Codex extension. + +## What third-party agents are + +Third-party agents come from providers such as Anthropic and OpenAI. They use the provider's SDK and agent harness, and they can work locally or in the cloud depending on the provider and your Copilot setup. + +Cloud-based third-party agents are currently in preview. + +## Why use them + +Third-party agents let you keep your workflow in VS Code while using provider-specific capabilities. That gives you: + +* The provider's agent behavior and SDK. +* A single chat experience inside the editor. +* The ability to debug, test, and code without switching tools. + +## Start a session + +Open the Chat view, select **New Chat**, and choose the agent type from the **Session Type** dropdown. + +For cloud sessions, first select **Cloud**, then choose the partner agent from the **Partner Agent** dropdown. + +For Claude, you can also use its slash commands, such as `/agents`, `/hooks`, and `/memory`. + +For Codex, install the OpenAI Codex VS Code extension and open the Codex view or the Codex tab in chat. + +![Screenshot showing session type dropdown with Claude agent option selected.](../../docs/copilot/images/third-party-agents/claude-agent-new-chat.png) + +![Screenshot showing session type dropdown with Codex agent option selected.](../../docs/copilot/images/third-party-agents/codex-agent-new-chat.png) + +## Enable cloud partner agents + +Before you can use cloud partner agents, enable them in your GitHub Copilot settings in GitHub. Once they are enabled, they appear in the VS Code session picker. + +![Screenshot showing cloud agent partner selection picker in chat input.](../../docs/copilot/images/third-party-agents/partner-agent-cloud-chat.png) + +## Choose the right permission mode + +Third-party agents can run with different permission modes, depending on the provider. Pick the mode that matches the task and your risk tolerance. For sensitive work, keep approval in the loop and combine the agent with sandboxing when possible. + +## Learn more about Claude and Codex + +Claude sessions use Anthropic's Claude Agent SDK and are available through your Copilot subscription. Codex sessions use the OpenAI Codex extension and support the same editor-centric workflow. + +Use either provider when you want to stay in VS Code and still take advantage of a third-party agent's own model and harness. + +![Screenshot showing Claude agent permission mode options.](../../docs/copilot/images/third-party-agents/claude-agent-permission-modes.png) + +## Why this matters + +Third-party agents let you keep your coding workflow in one place while still using provider-specific capabilities. That reduces context switching and keeps debugging, testing, and editing inside VS Code. + +## What's next + +You now have the four course topics covered. The next step is to fill in each page with the final transcript details, screenshots, and video embeds. + +## Learn more + +* [Third-party agents in Visual Studio Code](https://code.visualstudio.com/docs/copilot/agents/third-party-agents) +* [Agents overview](https://code.visualstudio.com/docs/copilot/agents/overview) +* [Security considerations](https://code.visualstudio.com/docs/copilot/security) diff --git a/learn/toc.json b/learn/toc.json index 302d3f8778..38995ea243 100644 --- a/learn/toc.json +++ b/learn/toc.json @@ -26,5 +26,16 @@ ["Customization Features Explained", "/learn/customizations/7-customization-features-explained"], ["Customization Features In Practice", "/learn/customizations/8-demo"] ] + }, + { + "name": "Agents", + "area": "agents", + "description": "Learn how to use tools, MCP servers, plugins, and third-party agents to extend agent workflows in VS Code.", + "topics": [ + ["Using tools with agents", "/learn/agents/1-using-tools-with-agents"], + ["Extending agents with MCP servers", "/learn/agents/2-extending-agents-with-mcp-servers"], + ["Agent plugins", "/learn/agents/3-agent-plugins"], + ["Using third-party agents in VS Code", "/learn/agents/4-using-third-party-agents-in-vs-code"] + ] } ] From 8ca3521c8c7d804767f19bcd8738e710042a39bc Mon Sep 17 00:00:00 2001 From: Kayla Cinnamon Date: Fri, 22 May 2026 16:23:56 -0400 Subject: [PATCH 2/3] New images and edits --- .../copilot-chat/chat-approval-options.png | 3 ++ .../chat-customizations-editor-plugins.png | 3 ++ .../claude-agent-new-chat-1.121.png | 3 ++ learn/agents/1-using-tools-with-agents.md | 36 ++++++++++--- .../2-extending-agents-with-mcp-servers.md | 33 ++++++++---- learn/agents/3-agent-plugins.md | 51 ++++++++++++++----- .../4-using-third-party-agents-in-vs-code.md | 43 ++++++++++++---- 7 files changed, 133 insertions(+), 39 deletions(-) create mode 100644 docs/copilot/chat/images/copilot-chat/chat-approval-options.png create mode 100644 docs/copilot/images/customization/chat-customizations-editor-plugins.png create mode 100644 docs/copilot/images/third-party-agents/claude-agent-new-chat-1.121.png diff --git a/docs/copilot/chat/images/copilot-chat/chat-approval-options.png b/docs/copilot/chat/images/copilot-chat/chat-approval-options.png new file mode 100644 index 0000000000..b5df226797 --- /dev/null +++ b/docs/copilot/chat/images/copilot-chat/chat-approval-options.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:58f8c55f6b1abcdeee9137ce63ade2f86d534dc7578077787318099749d4364e +size 33502 diff --git a/docs/copilot/images/customization/chat-customizations-editor-plugins.png b/docs/copilot/images/customization/chat-customizations-editor-plugins.png new file mode 100644 index 0000000000..fb5805cb95 --- /dev/null +++ b/docs/copilot/images/customization/chat-customizations-editor-plugins.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:8eaa18eecfbf5faeb079ebbd822fe9d20575d40088e9d7f48f511c222e48b4e6 +size 86550 diff --git a/docs/copilot/images/third-party-agents/claude-agent-new-chat-1.121.png b/docs/copilot/images/third-party-agents/claude-agent-new-chat-1.121.png new file mode 100644 index 0000000000..3a8932a9f5 --- /dev/null +++ b/docs/copilot/images/third-party-agents/claude-agent-new-chat-1.121.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:b2d49fca4a39434b9b92daa201cbd9e587f913b36102a728df5b7e36193367eb +size 36585 diff --git a/learn/agents/1-using-tools-with-agents.md b/learn/agents/1-using-tools-with-agents.md index 96edac1f8f..3438bd212d 100644 --- a/learn/agents/1-using-tools-with-agents.md +++ b/learn/agents/1-using-tools-with-agents.md @@ -18,7 +18,10 @@ Tools give agents in VS Code access to the workspace, the web, APIs, and other c ## Prerequisites -Before you start, install VS Code and sign in to GitHub Copilot. You also need access to the tools you want to use, such as MCP servers or extensions that contribute tools. +Before you start: you'll need VS Code Insiders installed and the GitHub Copilot and GitHub Copilot Chat extensions set up and signed in. You also need access to the tools you want to use, such as MCP servers or extensions that contribute tools. + +* [Download VS Code](https://code.visualstudio.com/) +* [Set up GitHub Copilot in VS Code](https://code.visualstudio.com/docs/copilot/overview#_step-1-set-up-copilot) ## What tools do @@ -30,14 +33,22 @@ Agents use tools to search code, read files, run commands, fetch content, and ca The agent selects tools from the enabled set based on your prompt and context. If you want to force a specific tool, type `#` and the tool name in chat. +For example, use `#codebase` in a prompt when you want the agent to focus on your repository context. + +To install more tools, open the Extensions view and search with the `@mcp` filter for MCP servers, or search normally for extensions that contribute tools. + ## Choose the right tools Open the Chat view, switch to **Agent**, and use the **Configure Tools** button in the chat input to choose the tools for the current session. -Select only the tools you need. A smaller tool set gives the model less to sort through and usually leads to better results. - ![Screenshot showing the Chat view with the Configure Tools button in the chat input.](../../docs/copilot/images/chat-tools/agent-mode-select-tools.png) +Select only the tools you need. A smaller tool set gives the model less to sort through and usually leads to better results. Every enabled tool also consumes part of the model's context window. + +A chat request can have a maximum of 128 tools enabled at a time, so keeping the active set focused also helps avoid tool count issues. + +![Screenshot showing the tool picker drop-down with built-in tools, MCP servers, and user-defined tool sets.](../../docs/copilot/images/chat-tools/chat-tools-picker.png) + > [!TIP] > Start with the fewest tools that can complete the task, then add more only when the agent needs them. @@ -45,9 +56,22 @@ Select only the tools you need. A smaller tool set gives the model less to sort Tool sets let you save related tools as a single reusable group. You can use them in chat prompts, prompt files, and custom agents. -Create a tool set from the Command Palette with **Chat: Configure Tool Sets**. Then add the tools you want in the generated `.jsonc` file. +Create a tool set from the Command Palette with **Chat: Configure Tool Sets**, or from the cog in the tool picker with **Create a new tool set file**. Then add the tools you want in the generated `.jsonc` file. + +Use tool sets when you want a repeatable setup for a task such as Python work, web research, or repository changes. Tool sets you create show up under **User defined tool sets** in the tool picker. + +## Limit tools for a custom agent + +When you build a [custom agent](https://code.visualstudio.com/docs/copilot/customization/custom-agents), you can list the tools and tool sets it has access to in the `tools` field of the agent's markdown frontmatter: + +```yaml +--- +description: Python testing helper +tools: ['search', 'edit', 'pylance', 'runTests'] +--- +``` -Use tool sets when you want a repeatable setup for a task such as Python work, web research, or repository changes. +You can also select **Configure Tools** in the agent file to pick tools from a quick pick and have VS Code update the list for you. ## Manage approvals @@ -62,7 +86,7 @@ You can keep your preferred mode across sessions with `setting(chat.permissions. > [!CAUTION] > Higher autonomy levels reduce the amount of review you do before tools run. Use them with care, especially when the agent can edit files or run terminal commands. -![Screenshot of a tool confirmation dialog showing tool details and approval options.](../../docs/copilot/images/chat-tools/chat-approve-tool.png) +![Screenshot of approval options.](../../docs/copilot/chat/images/copilot-chat/chat-approval-options.png) ## Use sandboxing for risky commands diff --git a/learn/agents/2-extending-agents-with-mcp-servers.md b/learn/agents/2-extending-agents-with-mcp-servers.md index 4d9a06381f..55b9f1449e 100644 --- a/learn/agents/2-extending-agents-with-mcp-servers.md +++ b/learn/agents/2-extending-agents-with-mcp-servers.md @@ -20,17 +20,22 @@ This course shows how to install an MCP server, configure it in your workspace o ## Prerequisites -Before you start, install VS Code and sign in to GitHub Copilot. You also need access to an MCP server or the ability to add one from the marketplace. +Before you start: you'll need VS Code Insiders installed and the GitHub Copilot and GitHub Copilot Chat extensions set up and signed in. You also need access to an MCP server or the ability to add one from the marketplace. + +* [Download VS Code](https://code.visualstudio.com/) +* [Set up GitHub Copilot in VS Code](https://code.visualstudio.com/docs/copilot/overview#_step-1-set-up-copilot) ## What MCP adds -Model Context Protocol is built around three primitives: +[Model Context Protocol](https://modelcontextprotocol.io/) is an open standard maintained by the Linux Foundation, and VS Code has full spec support. Think of MCP as the connector between agents and the external tools, data, and prompts they need. + +MCP is built around three primitives: * **Tools**: actions the agent can invoke. * **Resources**: context the agent can read. * **Prompts**: reusable prompt templates that standardize interactions. -That combination turns MCP into a flexible way to ground agents in external systems. +Servers can also expose interactive UI through MCP Apps, which render forms or visualizations inline in chat. ## Install an MCP server @@ -49,7 +54,7 @@ There are two common configuration scopes: Use workspace configuration when you want a server tied to a project. Use user profile configuration when you want the server available across workspaces. -You can also add a server through **MCP: Add Server** or open the user configuration with **MCP: Open User Configuration**. +You can also add a server through **MCP: Add Server** or open the user configuration with **MCP: Open User Configuration**. For servers that need credentials, store them in inputs in the user `mcp.json` so secrets are not committed to the workspace. > [!TIP] > VS Code provides IntelliSense and inline actions for `mcp.json`, which makes it easier to start, stop, and inspect servers. @@ -60,13 +65,17 @@ You can also add a server through **MCP: Add Server** or open the user configura Once a server is installed and enabled, open Chat, switch to **Agent**, and select the server's tools in the tools picker. -The agent can then call the server's tools when your prompt needs external context or actions. For example, an MCP server can ground a question in product documentation or call a browser tool to work with a web page. +The agent can then call the server's tools when your prompt needs external context or actions. For example, with the Microsoft Learn MCP server enabled, a prompt like "What are the Microsoft Python best practices?" grounds the answer in official documentation by calling the server's tools. + +![Screenshot showing an MCP tool invocation in chat with the input and output shown.](../../docs/copilot/images/mcp-servers/chat-agent-mode-tool-invocation.png) ## Secure MCP servers Treat local MCP servers as code that can run on your machine. Review the publisher and configuration before you install one. -For local stdio servers on macOS and Linux, you can enable sandboxing to restrict file system and network access. Sandboxed servers are auto-approved because they already run in a controlled environment. +By default, MCP tool calls prompt for approval before running, which keeps a human in the loop. For local stdio servers on macOS and Linux, you can enable sandboxing to restrict file system and network access. Sandboxed servers are auto-approved because they already run in a controlled environment. + +For example, with the Playwright MCP server, enabling sandboxing lets the agent navigate pages and run browser tasks without prompting on every step, because the work is isolated from your host. If a server needs more access, update the sandbox rules instead of widening access for the whole machine. @@ -78,10 +87,16 @@ You can manage servers from several places in VS Code: * The Extensions view. * The `mcp.json` editor. -* The Command Palette. -* The Agent Customizations view. +* The Command Palette, including **MCP: List Servers**. +* The Agent Customizations view from the cog in the Chat view. + +Use these surfaces to start or stop a server, browse the marketplace, and install additional servers. + +![Screenshot showing the actions for an MCP server in the Command Palette.](../../docs/copilot/images/mcp-servers/mcp-list-servers-actions.png) + +To debug a server, select **Show Output** from the server's actions to see logs from every request the server handles. -Use these surfaces to start or stop a server, inspect output, and install additional servers from the marketplace. +![Screenshot showing the MCP server output panel with logs.](../../docs/copilot/images/mcp-servers/mcp-server-error-output.png) ## Why this matters diff --git a/learn/agents/3-agent-plugins.md b/learn/agents/3-agent-plugins.md index aeb165f353..ea124260dc 100644 --- a/learn/agents/3-agent-plugins.md +++ b/learn/agents/3-agent-plugins.md @@ -20,23 +20,30 @@ This course shows how to install plugins, browse available collections, use plug ## Prerequisites -Before you start, install VS Code and sign in to GitHub Copilot. Then enable support for agent plugins in your settings. +Before you start: you'll need VS Code Insiders installed and the GitHub Copilot and GitHub Copilot Chat extensions set up and signed in. Then enable support for agent plugins in your settings. + +* [Download VS Code](https://code.visualstudio.com/) +* [Set up GitHub Copilot in VS Code](https://code.visualstudio.com/docs/copilot/overview#_step-1-set-up-copilot) ## What plugins provide A plugin can include any combination of: -* Slash commands. -* Agent skills. -* Custom agents. -* Hooks. -* MCP servers. +* Slash commands +* Agent skills +* Custom agents +* Hooks +* MCP servers That makes plugins useful for sharing a team workflow or adopting a prebuilt package of agent behavior. ## Install and manage plugins -Enable plugin support in the settings, then open the Agent Customizations view from the Chat view to browse available plugins. +Agent plugins are currently in preview. Enable them with `setting(chat.plugins.enabled)` in your user settings before you can install or browse plugins. + +By default, VS Code discovers plugins from the [copilot-plugins](https://github.com/github/copilot-plugins) and [awesome-copilot](https://github.com/github/awesome-copilot/) marketplaces. You can add more with `setting(chat.plugins.marketplaces)`. + +Open the **Agent Customizations** view from the cog in the Chat view, then select **Plugins** in the left menu to browse available plugins. From there, you can: @@ -45,7 +52,7 @@ From there, you can: * Create your own plugin. * Review which customizations are already installed. -After installation, the plugin's customizations appear alongside your local ones. +After installation, the plugin's customizations appear alongside your local ones in the **Agent Plugins - Installed** section of the Extensions view. ![Screenshot of browsing agent plugins in the Extensions sidebar.](../../docs/copilot/images/agent-plugins/extensions-view.png) @@ -55,22 +62,40 @@ After installation, the plugin's customizations appear alongside your local ones Plugins can expose custom agents, skills, and MCP servers all in one place. In chat, you can invoke plugin content with slash commands or by selecting the relevant customization from the picker. +For example, after installing the awesome-copilot plugin, you can run `/awesome-copilot:suggest` to have the plugin look across your project and recommend related collections you can install next. + That makes plugins useful when you want a single install to add a complete workflow, such as a testing package that includes a testing skill, a review agent, and an MCP server for reporting. -![Screenshot of the Agent Customizations editor showing installed plugin content.](../../docs/copilot/images/customization/chat-customizations-editor.png) +![Screenshot of the Agent Customizations editor showing installed plugin content.](../../docs/copilot/images/customization/chat-customizations-editor-plugins.png) > [!CAUTION] > Plugins can run hooks and MCP servers on your machine. Review the contents and publisher before you install one. ## Plugin structure -Plugins are defined by a `plugin.json` manifest and can point to folders for skills, agents, hooks, and MCP server definitions. That keeps related automation in one package and makes it easier to share across a team. +Plugins are defined by a `plugin.json` manifest and can point to folders for skills, agents, hooks, and MCP server definitions. The plugin format is shared between VS Code, GitHub Copilot CLI, and Claude Code, so a single plugin repository can work across all three tools. ## Share recommended plugins -If you want to recommend plugins for your team, add a shared plugin marketplace configuration to your repository and commit it. That lets teammates browse the same recommended sources and install the same collections in their own workspaces. - -Use this approach when you want consistent tooling across a team without forcing a plugin into every workspace. +To share a curated set of plugins with your team, add an `extraKnownMarketplaces` and `enabledPlugins` block to your project's `.github/copilot/settings.json` (or `.claude/settings.json`) file and commit it. + +```json +{ + "extraKnownMarketplaces": { + "company-tools": { + "source": { + "source": "github", + "repo": "your-org/plugin-marketplace" + } + } + }, + "enabledPlugins": { + "code-formatter@company-tools": true + } +} +``` + +Use this approach when you want consistent tooling across a team without forcing a plugin into every workspace. VS Code shows a notification the first time a chat message is sent, and team members can also view the recommended plugins from the Extensions view with the `@agentPlugins @recommended` filter. ## Why this matters diff --git a/learn/agents/4-using-third-party-agents-in-vs-code.md b/learn/agents/4-using-third-party-agents-in-vs-code.md index 5445bbf665..438c9b6bc3 100644 --- a/learn/agents/4-using-third-party-agents-in-vs-code.md +++ b/learn/agents/4-using-third-party-agents-in-vs-code.md @@ -18,7 +18,10 @@ Third-party agents let you use provider-specific agent experiences inside VS Cod ## Prerequisites -Before you start, install VS Code and sign in to GitHub Copilot. For cloud partner agents, make sure they are enabled in your GitHub Copilot settings. For Codex, install the OpenAI Codex extension. +Before you start: you'll need VS Code Insiders installed and the GitHub Copilot and GitHub Copilot Chat extensions set up and signed in. For cloud partner agents, make sure they are enabled in your GitHub Copilot settings. For Codex, install the OpenAI Codex extension. + +* [Download VS Code](https://code.visualstudio.com/) +* [Set up GitHub Copilot in VS Code](https://code.visualstudio.com/docs/copilot/overview#_step-1-set-up-copilot) ## What third-party agents are @@ -40,32 +43,50 @@ Open the Chat view, select **New Chat**, and choose the agent type from the **Se For cloud sessions, first select **Cloud**, then choose the partner agent from the **Partner Agent** dropdown. -For Claude, you can also use its slash commands, such as `/agents`, `/hooks`, and `/memory`. +![Screenshot showing session type dropdown with Claude agent option selected.](../../docs/copilot/images/third-party-agents/claude-agent-new-chat-1.121.png) + +For Codex, install the [OpenAI Codex](https://marketplace.visualstudio.com/items?itemName=openai.chatgpt) extension first. You can then open the Codex view from its activity bar icon or switch to the **Codex** tab in the Chat view. -For Codex, install the OpenAI Codex VS Code extension and open the Codex view or the Codex tab in chat. +## Claude agent slash commands -![Screenshot showing session type dropdown with Claude agent option selected.](../../docs/copilot/images/third-party-agents/claude-agent-new-chat.png) +Inside a Claude session, type `/` in the chat input to see the available commands. -![Screenshot showing session type dropdown with Codex agent option selected.](../../docs/copilot/images/third-party-agents/codex-agent-new-chat.png) +| Slash command | Description | +|---------------|-------------| +| `/agents` | Wizard for creating and managing Claude sub-agents. | +| `/hooks` | Configure lifecycle hooks that run at key points during a session. | +| `/memory` | Open and edit the `CLAUDE.md` memory file used across sessions. | +| `/init` | Initialize a new `CLAUDE.md` memory file for the project. | +| `/review` | Review code changes in a pull request. | +| `/security-review` | Run a security review on pending changes. | ## Enable cloud partner agents -Before you can use cloud partner agents, enable them in your GitHub Copilot settings in GitHub. Once they are enabled, they appear in the VS Code session picker. +Before you can use cloud partner agents, enable them in your GitHub Copilot settings. From github.com, open your profile menu, go to **Copilot settings** > **Cloud Agent**, then turn on the partner agents you want under **Partner Agents**. -![Screenshot showing cloud agent partner selection picker in chat input.](../../docs/copilot/images/third-party-agents/partner-agent-cloud-chat.png) +You can start a cloud session from the **Agents** tab on a GitHub repository: select the Copilot logo on the **New session** button to choose Claude or Codex. ## Choose the right permission mode -Third-party agents can run with different permission modes, depending on the provider. Pick the mode that matches the task and your risk tolerance. For sensitive work, keep approval in the loop and combine the agent with sandboxing when possible. +Claude agent runs with one of three permission modes that you can pick from the chat input: + +* **Edit automatically**: Claude makes workspace changes autonomously as it works. +* **Request approval**: Claude asks for your review before making changes. +* **Plan**: Claude outlines its intended approach before starting work. + +Pick the mode that matches the task and your risk tolerance. For sensitive work, keep approval in the loop and combine the agent with sandboxing when possible. + +![Screenshot showing Claude agent permission mode options.](../../docs/copilot/images/third-party-agents/claude-agent-permission-modes.png) + +> [!CAUTION] +> The `setting(github.copilot.chat.claudeAgent.allowDangerouslySkipPermissions)` setting bypasses all permission checks. Only enable it in isolated sandbox environments with no internet access. ## Learn more about Claude and Codex -Claude sessions use Anthropic's Claude Agent SDK and are available through your Copilot subscription. Codex sessions use the OpenAI Codex extension and support the same editor-centric workflow. +Claude sessions use Anthropic's Claude Agent SDK and are available through your Copilot subscription. Codex sessions use the OpenAI Codex extension and authenticate with a Copilot Pro+ subscription, with no extra setup required. Use either provider when you want to stay in VS Code and still take advantage of a third-party agent's own model and harness. -![Screenshot showing Claude agent permission mode options.](../../docs/copilot/images/third-party-agents/claude-agent-permission-modes.png) - ## Why this matters Third-party agents let you keep your coding workflow in one place while still using provider-specific capabilities. That reduces context switching and keeps debugging, testing, and editing inside VS Code. From d4d7d081c431f293c5e8c96c956bc10f0fa6e312 Mon Sep 17 00:00:00 2001 From: Kayla Cinnamon Date: Tue, 26 May 2026 08:21:30 -0400 Subject: [PATCH 3/3] Apply suggestions from code review Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com> --- learn/agents/4-using-third-party-agents-in-vs-code.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/learn/agents/4-using-third-party-agents-in-vs-code.md b/learn/agents/4-using-third-party-agents-in-vs-code.md index 438c9b6bc3..d04829c0f7 100644 --- a/learn/agents/4-using-third-party-agents-in-vs-code.md +++ b/learn/agents/4-using-third-party-agents-in-vs-code.md @@ -62,9 +62,9 @@ Inside a Claude session, type `/` in the chat input to see the available command ## Enable cloud partner agents -Before you can use cloud partner agents, enable them in your GitHub Copilot settings. From github.com, open your profile menu, go to **Copilot settings** > **Cloud Agent**, then turn on the partner agents you want under **Partner Agents**. +Before you can use cloud partner agents, enable third-party coding agents for your GitHub Copilot account by following the GitHub documentation. -You can start a cloud session from the **Agents** tab on a GitHub repository: select the Copilot logo on the **New session** button to choose Claude or Codex. +After third-party coding agents are enabled for your account, return to VS Code and start a session with Claude or Codex from the chat agent picker. ## Choose the right permission mode