🤖

古いAngularのプロジェクトで@angular/cli mcpを利用する (codex / claude)

に公開
2025/11/25
Angular
CLI
Model Context Protocol
Claude
Codex
tech

7月にリリースされた20.1.0の @angular/cliには、
AI Agentを利用してコーディングのベストプラクティスを提供しやすくするため、
MCPサーバー機能が実装されました❗️

今回、
自身のプロジェクト(Angular v16)のAngularパッケージアップデートをCodexに任せようと考え、
「この際にせっかくだから最近リリースされたangular-cli MCPを有効化して対応しようかな」
と思い至り、次のようにmcpを追加しました。 (https://angular.jp/ai/mcp この辺を参考に)

$ codex mcp add angular-cli -- npx -y @angular/cli@latest mcp

ところが、プロジェクト内でcodexを立ち上げると……。

■ MCP client for `angular-cli` faild to start: request timed out

うまく動かないではありませんか！ ｷﾞｮｴｰ!

色々苦戦しつつ、Angular日本ユーザー回のDiscordでlacoさんと相談しつつ、
Codexと壁打ちすることで腹落ち&解決したので、本記事にまとめます！

TL;DR

  • ローカルに古い CLI (v16 系など) が存在すると、 Codex の MCP 設定で @angular/cli@latest mcp を呼び出してもタイムアウトする
  • ~/.codex/config.toml でバージョンを固定しつつ NG_DISABLE_VERSION_CHECK=1 を渡すと、Codex でも安定して Angular CLI v20 の MCP サーバーを起動できた
  • NG_DISABLE_VERSION_CHECK は MCP プロセス専用に設定されるため、通常の ng コマンドには影響しない
    • ただし MCP から書き込み系ツールを使う場合は CLI とプロジェクトのバージョン差に注意

背景

Angular 公式から MCP 対応が発表されたので、Codex (CLI 版 ChatGPT) に @angular/cli の MCP サーバーを登録してみたところ request timed out で毎回失敗。
Laco さん（Angular チーム）のスクリーンショットを見る限り普通に動いていそうなのに、自分の環境だけ立ち上がらない。

2025-10-06T02:34:50Z ERROR MCP client for `angular-cli` failed to start: request timed out

環境

  • Codex CLI 0.44.0
  • プロジェクトの Angular CLI: 16.1.4 (devDependencies)
  • Node.js v22.13.1
  • MCP サーバー設定は ~/.codex/config.toml で管理

何が起きていたのか

Codex のログを眺めると、MCP 起動時に以下のコマンドが実行されていた。

program: "npx"
args: ["-y", "@angular/cli", "mcp"]
env: Some({"CI": "1", "NG_FORCE_TTY": "0"})
startup_timeout: 10s

ポイントは バージョン指定が無い @angular/cli を npx で呼んでいること。
Angular CLI の init.js には以下の挙動がある。

  1. npx で落ちてきたグローバル CLI (ここでは v20.3.4) がまず実行される。
  2. その直後に process.cwd() (作業ディレクトリ) を見に行き、ローカルに node_modules/@angular/cli が存在すればそちらに処理を委譲する。
  3. 手元のプロジェクトは v16.1.4 なので、mcp コマンドが存在せず Unknown command. Did you mean add? で即終了。

その結果、Codex は 10 秒待っても MCP サーバーからのハンドシェイクが来ない → タイムアウト、という流れだった。

解決策

1. ~/.codex/config.toml でバージョンを固定する

[mcp_servers.angular-cli]
command = "npx"
args = ["-y", "@angular/cli@20.3.4", "mcp"]

2. NG_DISABLE_VERSION_CHECK を設定する

[mcp_servers.angular-cli.env]
NG_DISABLE_VERSION_CHECK = "1"

これで init.js の「ローカル CLI を優先する」分岐がスキップされ、npx で取得した v20.3.4 がそのまま MCP サーバーに仕上がります。

3. Codex を再起動

設定ファイルを編集しただけでは反映されないので、Ctrl + C で Codex を落として再起動します。
ログに以下が出ていれば成功。

new_stdio_client ... args: ["-y", "@angular/cli@20.3.4", "mcp"] env: Some({"NG_DISABLE_VERSION_CHECK": "1"})
aggregated 67 tools from 4 servers

副作用は？

NG_DISABLE_VERSION_CHECK を MCP プロセスに渡すと、CLI v20 が Angular v16 プロジェクトを操作することになります。
読み取り系ツール(ベストプラクティスのドキュメント取得やプロジェクト一覧)なら問題ないですが、
将来的に書き換え系ツール (例: zoneless migration) が動く場合は互換性に注意したほうが良さそうです。

まとめ・所感

  1. Codex の MCP 設定で Angular CLI を呼ぶときは バージョン指定 が必須
  2. NG_DISABLE_VERSION_CHECK=1 を環境変数で渡すと、ローカル v16 へのフォールバックを防げる
  3. 頑張って設定したけど、古いバージョンのAngularプロジェクトではそもそも恩恵すくなさそう😹

付録: 設定例

最終的に動いた ~/.codex/config.toml の抜粋。

[mcp_servers.angular-cli]
command = "npx"
args = ["-y", "@angular/cli@20.3.4", "mcp"]

[mcp_servers.angular-cli.env]
NG_DISABLE_VERSION_CHECK = "1"

備考 Codexの不要だった提案

Codexと壁打ち中に次のような提案を受けていましたが、結果としていずれも不要でした。

~/.npm/_npx を消す

npx のキャッシュに古いものが残っている場合は rm -rf ~/.npm/_npx してから再試行すると確実。 みたいなことを何度か言われていましたが、キャッシュが悪さするみたいな挙動はなさそうでした。

環境変数 NG_FORCE_TTY と CI

angular-cli mcpは、環境がTTYかどうかで出力を変える実装になっているようです。

「これが悪さをしてmcpサーバーとしての動きが行われないのではないか？」という仮説をもとに、
NG_FORCE_TTY=1やCI=1を設定して起動することで回避できるのではないか？ と試行錯誤していましたが、最終的にこれらの設定は不要でした。

Discussion