Vercel × AI Coding Agents: The Plugin, Skills, and MCP Trio
The goal in one sentence: use three official commands to load Vercel's Plugin, Skills, and MCP trio into your AI coding agent so it can operate your Vercel projects directly, saving you the effort of switching back and forth between the terminal and the chat window.
Preparation
Before you start, confirm three things:
- You can run
npxin the terminal (which means Node.js is installed); if you getcommand not found, install Node.js first before continuing. - You have finished reading Advanced Handbook: Help AI Understand Your Project Better, and an AI coding agent is already configured in your project (for example, Claude Code).
- It is recommended to first go through Going Live on Vercel: One-Command Deployment with an AI Coding Agent to understand the basics of deploying to Vercel with an agent.
Each piece of the trio handles one part: the Plugin gives the agent official Vercel capabilities, Skills provide officially curated standard practices, and MCP connects the agent to your Vercel projects. All three commands come from Vercel officially and write the configuration automatically, so you don't need to edit files by hand; run them in order in the project root directory.
Follow Along
Step 1: Install the Vercel Plugin
Run this in the project root directory:
npx plugins add vercel/vercel-pluginThe first run will download the package before installing, so wait a moment. Expected result: the command finishes without errors, the plugin package vercel/vercel-plugin enters the agent configuration, and in subsequent conversations the agent can recognize Vercel-related tasks.
Step 2: Add Agent Skills
Next, run:
npx skills add vercel-labs/agent-skillsThis hands the skill package vercel-labs/agent-skills, officially maintained by Vercel, to the agent. According to the official documentation, this command is mainly intended for agents not on the Plugin support list; agents on the list (Claude Code, Codex, Cursor, GitHub Copilot, etc.) already gain deployment skills and framework best practices after installing the Plugin in step 1. Expected result: the skills are added successfully, and the agent has official references when handling common tasks in Vercel projects, no longer improvising purely from the model's memory.
Step 3: Connect the Vercel MCP server
Finally, run:
npx -y add-mcp https://mcp.vercel.com -gThis registers the official Vercel MCP (Model Context Protocol) server https://mcp.vercel.com with the agent; -y makes npx skip the download confirmation so the command can be copied as-is, and -g means it takes effect globally, so all projects can connect to it afterward.@@I18N_KEEP_000009@@Expected result: the command reports a successful addition, and mcp.vercel.com appears in the agent's server list.
Verify
Start a new agent session (new configurations are not hot-reloaded) and give the instruction directly:
Check the status of my projects on Vercel, then deploy the current project.
If the agent starts calling Vercel-related tools instead of throwing a command at you to run yourself, the Vercel MCP trio is working; once the deployment finishes, have it send you the live URL and open it to confirm the page works. With Claude Code, you can also type /mcp to check the server connection status.@@I18N_KEEP_000010@
If the agent says it can't find the relevant tools, go back to step 3 to confirm the command ran successfully, then open a new session and try again.
Common Pitfalls
- Running in the wrong directory: all three commands must be run in the project root directory; don't run them in a subdirectory or in another project.
- npx stuck at a confirmation prompt: the third command includes
-yto auto-confirm; if the first two ask whether to install a package, just confirm as prompted. - No change in the agent after installation: agents don't automatically load new configurations, so open a new session and try again.
- MCP won't connect: the first connection to
mcp.vercel.commay require completing Vercel account authorization; follow the prompts the agent gives to finish the flow, then retry.@@I18N_KEEP_000011@ - Only installed one or two of them: per the official documentation, Plugin and Skills are an either-or choice based on the agent (install Plugin for agents on the support list, Skills for those off it), so you don't need both; MCP independently handles connecting the agent to your Vercel projects and is recommended.
Next Lesson
At this point, the agent can operate Vercel on your behalf. In the next lesson, Custom Domains: From github.io to Your Own Domain, you'll replace the temporary deployment URL with your own domain. To further strengthen the agent's understanding of this project, you can use it together with AGENTS.md and CLAUDE.md: Leave a Project Manual for AI.