DocsFrame

AIコーディングエージェント（Claude Code / Roo / Cline など）が長いドキュメントを作成するためのフレームワーク

AIエージェント自身が長いコンテンツを複数ファイルに分割して書き込み、最後に単一のCOMBINED.mdに結合してユーザーに提供します。

用途

AIエージェントが以下のような長いドキュメントを生成する際に使用：

• 📚 技術ドキュメント・マニュアル
• 📝 設計書・仕様書
• 📖 チュートリアル・ガイド
• 📊 レポート・分析結果
• 🔍 調査結果のまとめ

特徴

✅ 構造化された出力 - 複数ファイルに分割して整理された出力 ✅ 自動結合 - ビルドコマンド一発で単一ファイル化 ✅ 視認性向上 - 区切り線、目次、メタデータで読みやすく ✅ トークン効率 - 小さな単位で書き込み、一度に結合

クイックスタート

# 依存関係のインストール
npm install

# ドキュメントのビルド
npm run build

ディレクトリ構造

docsframe/
├── doc/                      # マークダウンファイル
│   ├── 1.プロジェクト概要.md
│   ├── 2.使い方.md
│   └── ...
├── scripts/
│   └── build.ts              # ビルドスクリプト
├── build.config.json         # ビルド設定
└── COMBINED.md               # 生成されたドキュメント

設定オプション

build.config.jsonで以下を設定できます：

{
  "separator": "\\n\\n",        // ファイル間の区切り
  "addDividers": true,         // --- 区切り線を追加
  "addTOC": true,              // 目次を自動生成
  "addFileHeaders": true,      // ソースファイル名を表示
  "addMetadata": true,         // 生成日時などを追加
  "customHeader": "...",       // カスタムヘッダー
  "customFooter": "..."        // カスタムフッター
}

設定例

シンプル（デフォルト）

{
  "separator": "\\n\\n",
  "addDividers": false,
  "addTOC": false
}

フル機能

{
  "addDividers": true,
  "addTOC": true,
  "addFileHeaders": true,
  "addMetadata": true,
  "customHeader": "# マイドキュメント\\n",
  "customFooter": "\\n---\\n**終了**"
}

ファイルの命名規則

• 番号プレフィックス - ファイルの順序を制御（例：1.概要.md, 2.使い方.md）
• アンダースコア除外 - _で始まるファイルはビルドから除外（例：_draft.md）
• ソート順 - ファイル名の辞書順でソート

AIエージェント向けワークフロー

1. ドキュメント作成タスクを受け取る

ユーザー: 「Reactのチュートリアルドキュメントを作成して」

2. 複数ファイルに分割して書き込む

AIエージェント（Claude Code等）が以下のように実行：

// Writeツールで複数ファイルに分割して書き込み
Write("doc/1.はじめに.md", "# はじめに\n\n...")
Write("doc/2.環境構築.md", "# 環境構築\n\n...")
Write("doc/3.基本概念.md", "# 基本概念\n\n...")
Write("doc/4.実装例.md", "# 実装例\n\n...")
Write("doc/5.まとめ.md", "# まとめ\n\n...")

3. ビルドして結合

npm run build

4. ユーザーに COMBINED.md を提供

目次、区切り線、メタデータ付きの完全なドキュメントが生成されます。

AIエージェントのメリット

• トークン制限回避 - 長文を小分けにして書き込める
• 構造化 - セクションごとに整理して出力
• 再利用性 - 各セクションを個別に修正可能
• 可読性 - 最終的に統合された読みやすいドキュメント

ライセンス

MIT