AIエージェントからLovableを直接操作できるようになった。2026年5月7日、ビジュアルアプリビルダーのLovableがMCPサーバーをResearch Previewとしてリリースした。Claude CodeやCursorなどのAIツールからLovableのプロジェクト作成・編集・デプロイをプログラム的に呼び出せる。

この記事でわかること:

  • Lovable MCPサーバーとは何か、既存のチャットコネクターとの違い
  • できること(プロジェクト作成・コード検査・デプロイ・DB操作など)
  • Claude Desktop・Cursor・Claude Codeへの接続手順
  • 利用条件と注意点

MCPとは

MCP(Model Context Protocol)は、AIエージェントが外部ツールを発見して呼び出すためのオープン標準だ。エージェントがMCPサーバーに接続すると、利用できるツールの一覧が返り、エージェントは状況に応じてそれらを呼び出す。

LovableのMCPサーバーは https://mcp.lovable.dev で公開されており、Claude DesktopやCursorなどMCP対応のクライアントからLovableを「操作可能なツールの1つ」として扱えるようにする。

既存のチャットコネクターとの違い

Lovableにはすでに「チャットコネクター」と呼ばれる機能があり、NotionやLinear、Jiraなどと連携してLovableのエージェントが外部ツールを参照しながらアプリを構築できる。

今回のMCPサーバーはこれとは逆の方向だ。Lovableのエージェントが外部に接続するのではなく、外部のAIエージェントがLovableに接続してプロジェクトを操作する。

チャットコネクター MCPサーバー
主体 Lovableのエージェント 外部のAIエージェント
接続方向 Lovable → 外部ツール 外部ツール → Lovable
用途 NotionやLinearからコンテキストを読む Claude CodeやCursorからLovableを制御する

MCPサーバーでできること

接続後にエージェントが呼び出せるツールは、大きく6カテゴリに分かれる。

プロジェクト管理: プロジェクトの作成・一覧取得・デプロイ・リミックス。 でアプリの説明を渡すだけでLovableが初期ビルドを完了し、プレビューURLを返す。

エージェントへのメッセージ送信: でLovableの編集エージェントにメッセージを送り、機能追加やデザイン変更を指示できる。 を指定して非同期で処理し、後から でポーリングすることも可能だ。

コード検査: で直近の編集差分を取得、 と でプロジェクト内のファイルを読み込める。変更履歴のレビューや、CI/CDパイプラインへの組み込みに使いやすい。

データベース操作: でLovable CloudのデータベースにSQLを直接実行できる。スキーマの変更を含む読み書きが可能で、データ移行スクリプトの自動実行などに活用できる。

ナレッジ管理: ワークスペースやプロジェクトごとにAIへのカスタム指示を設定・取得できる。「このプロジェクトはこのUIガイドラインに従え」といった指示をエージェントに記憶させられる。

アナリティクス: 公開済みアプリの訪問者数・ページビュー・直帰率などを取得するツールも含まれる。

接続手順

Claude Desktop

~/Library/Application Support/Claude/claude_desktop_config.json(macOS)または %APPDATA%\Claude\claude_desktop_config.json(Windows)に以下を追記する。

{
  "mcpServers": {
    "lovable": {
      "type": "http",
      "url": "https://mcp.lovable.dev"
    }
  }
}

保存後にClaude Desktopを再起動すると、Lovableのツールがエージェントのツールリストに表示される。

Cursor

~/.cursor/mcp.json(グローバル設定)または .cursor/mcp.json(プロジェクト設定)に以下を追記する。

{
  "mcpServers": {
    "lovable": {
      "type": "http",
      "url": "https://mcp.lovable.dev",
      "auth": {
        "CLIENT_ID": "6d465f583e1e4ce5801b1616f735670c"
      }
    }
  }
}

Claude Code

ターミナルから1行で追加できる。

claude mcp add --transport http lovable "https://mcp.lovable.dev"

認証方式

初回接続時はOAuthでブラウザが開き、Lovableアカウントへの認証を求められる。ヘッドレス環境やスクリプトからの利用には、LovableのワークスペースSettings → API keysでAPIキー(lov_から始まる)を発行し、MCPクライアントの設定に渡す。

利用条件と注意点

MCPサーバーはProまたはBusinessプランのユーザーのみが利用できる。Freeプランでは接続できない。

接続したクライアントはワークスペース全体へのアクセス権を持つ。1つのプロジェクトに限定されるのではなく、アカウント内のすべてのプロジェクトを読み書きできる。ツール呼び出しはリアルタイムでクレジットを消費し、deploy_project は即座に本番公開される。

query_database はデータベースの完全な読み書き権限で実行されるため、スキーマ変更や削除を含む操作が可能な点にも注意が必要だ。AIエージェントに広い権限を渡すことになるため、自動化スクリプトに組み込む際は実行内容を事前に確認しておきたい。

Research Previewのため、ツール名・パラメーター・レスポンスの形式は予告なく変更される可能性がある。本番システムへの組み込みより、まず試験的な自動化や個人プロジェクトでの検証から始めるのが現実的だ。

まとめ

Lovableがエージェントに「操作される側」として機能するようになった。Claude CodeやCursorのセッションを抜けることなくLovableのプロジェクトを起動・反復・公開できるため、AIエージェントを中心に開発ワークフローを組んでいる人にとっては即戦力になる。フルスタックアプリを「別タブで開く」のではなく「エージェントへの指示の1ステップ」として扱えるようになる変化だ。