StackMCP

Set up Puppeteer MCP in VS Code

Automate browsers with Puppeteer. Navigate pages, take screenshots, fill forms, and generate PDFs from your AI editor.

1

Locate the config file

VS Code reads MCP server configuration from the following file:

.vscode/settings.json → mcp section

Create this file if it does not already exist. For VS Code, this is inside your workspace .vscode/settings.json file under the mcp section.

2

Add the configuration

Add the following to your VS Code config file:

json
{
  "servers": {
    "puppeteer-mcp": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-puppeteer"
      ]
    }
  }
}
3

Set up environment variables

No environment variables needed. Puppeteer MCP works out of the box without any API keys or tokens.

4

Verify it works

Restart VS Code. Puppeteer MCP should appear in your MCP server list with 8 tools available.

This server adds approximately 4,120 tokens to your context window for tool definitions.

Set up Puppeteer MCP in other editors

Claude CodeCursorWindsurfClaude DesktopContinue
← Back to Puppeteer MCP