はじめに

最近、Googleの次世代IDE（自律型AIエージェント）である「Google Antigravity」を活用して、家計簿アプリ『くふう Zaim』の入力補助ツール『Zaim Lens』（非公式アプリ）を個人開発しました。

このアプリはSingle Page Application (SPA)構成のPWAとして開発しているのですが、AIを用いたレシートの自動解析や、複数アカウント間での履歴コピー機能などの実装を進めるにつれて、フロントエンドのコードベースが順調に育ってしまいました。メインのロジックが書かれた app.js がついに2,500行に迫り、見通しが悪くなってきたため、AIエージェントに全体のリファクタリング（モジュール分割）を依頼することにしました。

本記事では、その過程で発見した「AIに書かせ、静的解析ツールでチェックさせ、エラーが出たらAI自身に直させる」という、次世代のスマートなリファクタリング手法について共有します。

1. AIアーキテクト（Gemini）とAIエージェント（Antigravity）の見事な連携

巨大なファイルを分割する際、リファクタリングの方針（どの機能をどのファイルに切り出すか）を人間がゼロから考えるのは大変です。

そこで、まずは「AIアーキテクト」として普段使いのGeminiアプリに相談しました。
「今 app.js が2,500行くらいあって辛いんだけど、機能ごとにモジュール分割するリファクタリングの構成案を考えて」と投げます。

するとGeminiは、見事なディレクトリ構成案と同時に、「Antigravity（開発エージェント）にそのまま投げるための指示プロンプト」 を生成してくれました。
人間がやったことは、出力された設計の妥当性をサッと確認し、プロンプトをコピーしてAntigravityに貼り付けるだけです。過去の記事でも触れましたが、この「設計はGeminiアプリ、実装はAntigravity」という分業は非常に強力です。

2. 人間の関与なし。10分間で完了する自律リファクタリング

Geminiが作ってくれた指示プロンプトをAntigravityに入力し、あとはAIに任せて放置しました。

すると、Antigravityは自律的に既存の app.js を読み込み、ファイルの新規作成とコードの移行をどんどん進めていきます。人間が一切コードに触れることなく、約10分間ただ待っているだけで、2,500行の巨大なファイルが機能（通信関連、機能・画面ごとのロジック、共通処理等）ごとに美しく切り出され、ロジックの分割という大仕事が自動で完了してしまいました。

3. 遭遇した「AI特有の不具合」と、実行時エラーのモグラ叩き

しかし、いざブラウザを開いて動作確認をしようとするとエラーが。

原因は、ファイル分割時に発生した「import漏れ」や「変数のスコープ外参照」でした。
AIはファイル内のロジックを綺麗に切り出すのは得意ですが、複数のファイルにまたがる依存関係の紐付け（import/exportの整合性）においては、意外とケアレスミスを起こしやすいという特有の弱点がありました。

最初は、ブラウザのコンソールに出た実行時エラーをコピーしてAntigravityに渡し、「ここでエラーが出てるから直して」と指示していましたが、一つ直すと今度は別のモジュールでエラーが出る……という「実行時エラーのモグラ叩き」状態に陥ってしまいました。
この方法は、人間のレビュー時間を無駄に奪うため、全くスマートではありませんでした。

4. 静的解析コマンドによる「自律的修正ループ」の確立

そこでアプローチを変えました。人間が実行時エラーを一つずつ確認して教えるのをやめ、「静的解析ツール（Linter）」を導入したのです。

そして、Antigravityに対して以下のように指示を出しました。

「静的解析のコマンド（npx --package typescript tsc -p jsconfig.json --noEmit）を実行し、対象のエラーがすべて消えるまで修正と確認を繰り返してください。」

すると、エージェントは自らターミナルを開いてコマンドを実行し、出力された複数のimportエラーや未定義変数の警告を読み取り、対象のコードを修正し、再度コマンドを叩く……というループを開始しました。
AIは何度も静的解析と修正のトライ＆エラーを繰り返し、最終的に「エラーがゼロになるまで」のループを完全に自律的に完遂したのです。

さらに、CI（GitHub Actions等）にもLinterを設定しておくことで、人間がブラウザを開いて実行時エラーに遭遇する前に、機械的かつ網羅的なフィードバックをAIへ随時返せる体制が整いました。

※ちなみに、Vanilla JS環境でtscを動かすため、プロジェクト直下に以下のような簡単な jsconfig.json を置くだけで準備完了です。ビルド環境は一切不要です。

jsconfig.json

{
  "compilerOptions": {
    "module": "ESNext",
    "target": "ESNext",
    "moduleResolution": "node",
    "checkJs": true,
    "allowJs": true,
    "baseUrl": ".",
    "paths": {
      "/*": ["./*"]
    }
  },
  "exclude": ["node_modules", "static/app.js"]
}

5. 結論：静的解析は、AIエージェントの「最高のインターフェース」になる

今回のリファクタリング体験を通して、開発手法の大きなパラダイムシフトを感じました。

Geminiアプリ で設計と指示書を作成
Antigravity で実装
静的解析ツール でテストと修正ループを回す

これまで、Linterや静的型チェックといったツールは「人間がケアレスミスを防ぐために導入するもの」でした。しかしAI駆動開発の時代において、これらの静的解析ツールは 「AIに自律的な修正ループを回させるための、最も客観的で正確なフィードバック装置（インターフェース）」 として再定義されます。

「AIに書かせ、静的解析ツールでチェックさせ、エラーが出たらAI自身にコマンドを叩かせて直させる」

人間はただ、その仕組み（ルール）を用意してあげるだけでいいのです。

もし、肥大化したコードの整理に悩んでいる方や、AIが起こす「import忘れ」などの些細なバグのモグラ叩きに疲弊している方がいれば、ぜひ「AIエージェント × 静的解析の自律ループ」を試してみてください。次世代のスマートな開発体験に感動するはずです。

参考リンク

関連記事②：【Antigravity】AI開発はローカルルールが伝わらない？AntigravityのAgent Skillsで独自のCI/CDワークフローを構築する