microsoft playwright-mcp 構築手順

1. 前提条件の確認

• Node.jsのインストール: Playwright-MCPはNode.jsを使用するため、最新のLTSバージョンをインストールしてください（例: v18.xまたはv20.x）。
  • 確認方法: ターミナルで node -v を実行し、バージョンが表示されるか確認。
  • 未インストールの場合は、公式サイトからダウンロードしてインストール。
• Gitのインストール: GitHubからリポジトリをクローンするために必要です。
  • 確認方法: git --version
  • 未インストールの場合は、公式サイトからインストール。
• OS: Windows、macOS、またはLinuxがサポートされています。

2. リポジトリのクローン

1. ターミナル（またはコマンドプロンプト）を開きます。
2. 以下のコマンドを実行して、リポジトリをPCにクローンします:

   git clone https://github.com/microsoft/playwright-mcp.git
   

3. クローンしたディレクトリに移動します:

   cd playwright-mcp
   

3. 依存関係のインストール

1. プロジェクトの依存関係をインストールします:

   npm install
   

   • これにより、Playwrightやその他の必要なパッケージがインストールされます。
2. Playwrightのブラウザをインストールします（初回のみ必要）:

   npx playwright install
   

   • Chromium、Firefox、WebKitがダウンロードされます。

4. MCPサーバーの起動

1. サーバーを起動する基本コマンドを実行します:

   npx @playwright/mcp@latest --headless
   

   • --headless: ブラウザをヘッドレスモード（画面表示なし）で起動。
   • ヘッド付きモード（ブラウザ画面を表示）で試したい場合は、--headlessを省略するか、--headedを指定。

2. 起動すると、MCPサーバーが立ち上がり、ブラウザ自動化のためのツールが利用可能になります。

5. 設定の調整（必要に応じて）

• 構成ファイル: MCPサーバーの動作をカスタマイズしたい場合、claude_desktop_config.jsonなどの設定ファイルを編集します（Claude Desktopなどと連携する場合）。
  • 例（macOSの場合の設定ファイルパス）:

    ~/Library/Application\ Support/Claude/claude_desktop_config.json
    

  • 設定例:

    {
      "mcpServers": {
        "playwright": {