webdev-mcp

便利な Web 開発ツールを提供する MCP サーバー。

使用法

カーソル

• プロジェクトにインストールするには、MCP サーバーを.cursor/mcp.jsonに追加します。

{
	"mcpServers": {
		"webdev": {
			"command": "npx",
			"args": ["webdev-mcp"],

		}
	}
}

• グローバルにインストールするには、カーソル設定に次のコマンドを追加します。

npx webdev-mcp

ウィンドサーフィン

• MCP サーバーを~/.codeium/windsurf/mcp_config.jsonファイルに追加します。

{
	"mcpServers": {
		"webdev": {
			"command": "npx",
			"args": ["webdev-mcp"]
		}
	}
}

Related MCP server: PuppeteerMCP Server

ツール

現在、利用可能なツールはtakeScreenshotとlistScreens 2つだけです。エージェントは list screens ツールを使用して、スクリーンショットを撮りたい画面の画面IDを取得できます。

このツールは、スクリーンショットを base64 でエンコードされた文字列として返します。

ヒント

最適なエクスペリエンスを得るには、カーソル設定でYOLOモードがオンになっていること、MCPツール保護がオフになっていることを確認してください。macOSでは、カーソルによる画面録画を許可する必要があるかもしれません。