The npm-dev-mcp server manages npm run dev processes with automated project discovery, background execution, log monitoring, and port management.
Core Capabilities:
Project Management: Automatically detects projects with
package.jsonand dev scripts, including monorepo support and subdirectories. Loads.envfiles automatically and prioritizes projects based on detection algorithms.Process Control: Start, stop, and restart dev servers in the background with directory specification for running multiple servers in parallel. Supports concurrent execution across different projects.
Monitoring & Logging: Real-time log viewing with configurable line counts (1-1000 lines, default 50), directory filtering, and timestamp tracking. Check status of all running processes including PIDs, ports, uptime, and resource usage.
Port Management: Automatic detection and tracking of ports used by development servers with conflict detection. Cross-platform support using lsof (macOS) and netstat (Linux).
Health & Recovery: Check server health with basic or detailed reports including memory usage and component checks. Recover from saved states with configurable auto-recovery (1-10 retries, default 3), force recovery mode, and optional MCP server restart.
Additional Features: Cross-platform compatibility (requires Node.js 18+), command-line interface via npx or global installation, MCP integration with Claude Code, and optional HTTP health endpoints for external monitoring systems like Prometheus.
Automatically detects and applies environment variables from .env files for development servers
Supports Linux environments using netstat command for development server port detection
Provides platform-specific functionality for macOS, utilizing lsof command for port detection
Manages npm run dev processes for Node.js projects with automatic project detection and environment configuration
Controls npm run dev processes with background execution, real-time log monitoring, and process management capabilities
Detects and manages Vite-based development servers, including port management and process control
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@npm-dev-mcpstart dev server for my frontend project"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
@masamunet/npm-dev-mcp
npm run devプロセスを管理するMCPサーバーです。プロジェクトの自動検出、バックグラウンド実行、ログ監視、ポート管理機能を提供します。
機能
プロジェクト自動検出: package.jsonとdevスクリプトを持つディレクトリを自動で検索
モノレポ対応: サブディレクトリのプロジェクトも検出・管理
環境変数読み込み: .envファイルの自動検出・適用
ポート管理: 開発サーバーが使用するポートの自動検出
ログ監視: リアルタイムログ監視と履歴管理
プロセス管理: 複数プロジェクトの並行実行、安全な開始・停止・再起動
Related MCP server: Project Content Server
利用可能なツール
scan_project_dirs
プロジェクト内のpackage.jsonとdevスクリプトを検索します。
start_dev_server
指定ディレクトリでnpm run devをバックグラウンドで開始します。
パラメータ:
directory(オプション): 実行ディレクトリ(未指定時は自動検出)。異なるディレクトリを指定することで、複数の開発サーバーを同時に起動できます。
get_dev_status
npm run devプロセスの状態を確認します。
get_dev_logs
npm run devのログを取得します。
パラメータ:
lines(オプション): 取得行数(デフォルト:50、最大:1000)directory(オプション): 対象のプロジェクトディレクトリ。複数実行時に特定するために使用します。
stop_dev_server
npm run devプロセスを停止します。
パラメータ:
directory(オプション): 対象のプロジェクトディレクトリ。複数実行時に特定するために使用します。
restart_dev_server
npm run devプロセスを再起動します。
パラメータ:
directory(オプション): 対象のプロジェクトディレクトリ。複数実行時に特定するために使用します。
get_health_status
MCPサーバー自身のヘルス状態を取得します。
パラメータ:
detailed(オプション): 詳細なヘルスレポートを取得するかどうか(デフォルト: false)
recover_from_state
保存された状態からの復旧を試行します。
パラメータ:
force(オプション): 強制的に復旧を実行するかどうか(デフォルト: false)
インストールと使用
0. 公開情報
パッケージはnpmレジストリに公開されています:
パッケージ名:
@masamunet/npm-dev-mcpバージョン: 1.1.0
レジストリ: https://www.npmjs.com/package/@masamunet/npm-dev-mcp
1. npx経由での直接使用(推奨)
2. グローバルインストール
3. ローカル開発用ビルド
4. MCPサーバーとして起動
5. Claude Codeでの設定
5.1 コマンドラインから追加(推奨)
Claude Codeのmcpコマンドを使用して簡単に追加できます:
このコマンド実行後、Claude Codeを再起動すると@masamunet/npm-dev-mcpが利用可能になります。
5.2 手動での設定ファイル編集
手動で設定する場合は、設定ファイルを直接編集します:
設定ファイルの場所:
macOS:
Windows:
設定内容:
方法1: 直接パス指定
方法2: npx経由(--mcpフラグ使用)
注意事項:
方法1の
argsの配列内のパスは絶対パスで指定してください例:
"/Users/username/projects/@masamunet/npm-dev-mcp/dist/index.js"相対パスや
~は使用できません方法2では
--mcpフラグが必要です(MCPサーバーモードを強制)
5.3 Claude Codeの再起動
設定を追加した後、Claude Codeを再起動すると、@masamunet/npm-dev-mcpサーバーが利用可能になります。
5.4 動作確認
Claude Code内で以下のように使用できます:
開発
スクリプト
npm run build: TypeScriptをコンパイルnpm run dev: 開発モード(ウォッチモード)npm start: MCPサーバーを起動
プロジェクト構造
対応プラットフォーム
macOS (lsofコマンド使用)
Linux (netstatコマンド使用)
Node.js 18以上
トラブルシューティング
MCPサーバーが応答しない場合
MCPサーバーがクラッシュしたり応答しなくなった場合の復旧方法:
1. 開発サーバーのみ復旧する場合
Claude Code内での復旧:
→ restart_dev_server ツールが自動実行されます
コマンドラインからの復旧:
2. MCPサーバー全体を復旧する場合
Claude Codeの再起動:
Claude Codeアプリケーションを完全に終了
アプリケーションを再起動
MCPサーバーが自動的に再接続されます
手動でのMCPサーバー確認:
3. 設定の確認
MCPサーバーが起動しない場合、設定ファイルを確認:
macOS:
Windows:
正しい設定例:
4. PM2を使用したプロセス管理(上級者向け)
より堅牢な運用を行いたい場合、PM2プロセスマネージャーを使用できます:
PM2のインストール:
PM2でのMCPサーバー管理:
PM2の利点:
自動再起動(クラッシュ時)
メモリ監視と制限
ログローテーション
クラスター機能(必要に応じて)
5. 外部監視用ヘルスチェックエンドポイント
外部の監視システム(Prometheus、Nagios等)と連携するためのHTTPエンドポイントを提供できます:
ヘルスエンドポイントの有効化:
利用可能なエンドポイント:
環境変数:
HEALTH_ENDPOINT: エンドポイントを有効化(true/false)HEALTH_PORT: ポート番号(デフォルト: 8080)HEALTH_HOST: ホスト(デフォルト: 127.0.0.1)HEALTH_PATH: ヘルスチェックパス(デフォルト: /health)
6. よくある問題と解決方法
問題: "spawn ENOENT" エラー
原因: Node.jsまたはnpxが見つからない
解決: PATHの確認とNode.jsの再インストール
問題: 開発サーバーが起動しない
原因: ポートが使用中、package.jsonの設定不備
解決:
npx @masamunet/npm-dev-mcp scanでプロジェクト検出を確認
問題: ログが表示されない
原因: プロセスが正常に開始されていない
解決:
npx @masamunet/npm-dev-mcp statusで状態確認
ライセンス
MIT