画像タイトル
\n画像の説明
\n![\"画像alt\"](\"http://example.com/image.png\")
`付きのインタラクティブなファイルツリーに組み替えます。\n\n```\n[tree]\n#### ファイルツリー\n- src/\n - styles/\n - base.css\n - **components/**\n - **a-lot-of-files/**\n[/tree]\n```\n\n```html\n\n \n \n \n```\n\nコードのタイトル指定がない場合、通常のMarkdownのコードブロックとして処理されます。\n\n\n## コードの修正・機能追加\n\nメンテナンスモードに入っていますが、バグ修正や軽微な機能追加を行いたい場合は以下を参考にしてください。\n\n### ランタイムの全体像\n\n`lib/index.js`がトークナイザ・レンダラ・トランスフォーマを束ねてMarkdownをHTMLに変換します。新しい機能はここから呼び出される既存の拡張点を利用してください。処理の流れを追うには`lib/tokenizer/`→`lib/renderer/`→`lib/transformer/`の順に読むと把握しやすいです。\n\n### 拡張記法\n\ncgmdのレンダラは`lib/renderer/cgmd/`に追加し、`lib/renderer/cgmd.js`に登録します。DOMレベルの整形は`lib/transformer/`に置きます。小さな単位のレンダラを作り、必要に応じて`lib/renderer/md/`の既存実装を参考にしてください。\n\n### CLIとサンプル\n\n`bin/cgmd.js`が`cgmd`コマンドを提供します。ローカルでHTML出力を試すには`example/main.js`を使うか`npm run example`を実行して挙動を確認できます。CLIの引数追加や既定値の変更は`bin/cgmd.js`を編集してください。\n\n### テスト\n\nテストは`test/`以下に配置し、Node組み込みテストで実行します。\n\n| コマンド | 説明 |\n|---|---|\n| `npm test` | 全テストを実行 |\n| `npm run test:watch` | ファイル変更を監視しながら反復実行 |\n| `npm run test:update-snapshots` | スナップショットを更新 |\n\nテストの配置：\n\n- レンダラ：`test/cgmd/renderer/`\n- トークナイザ：`test/cgmd/tokenizer/`\n- トランスフォーマ：`test/cgmd/transformer/`\n- CLI：`test/cgmd/cli.js`\n\n#### スナップショットテスト\n\nCLIのテスト（`test/cgmd/cli.js`）は`node:test`のスナップショット機能（`t.assert.snapshot()`）を使っています。スナップショットは`test/cgmd/cli.js.snapshot`に保存されており、コミット対象です。\n\nCLIの出力が意図的に変わった場合は`npm run test:update-snapshots`でスナップショットを更新してからコミットしてください。\n\n### 開発の流れ\n\n- **環境**：Node.js 24以上が必要です\n- 依存を整える：`npm ci`\n- 実装を加える：拡張は`lib/renderer/cgmd/`、DOM整形は`lib/transformer/`\n- 動作確認：サンプルの`npm run example`または最小入力での単体実行\n- テスト：失敗→修正→`npm run test:watch`で反復\n- スナップショット更新：CLIの出力が変わった場合は`npm run test:update-snapshots`\n- ドキュメント：新しい記法やオプションは`README.md`に追記\n\n## LICENSE\n\n[MIT License](./LICENSE)\n","readmeFilename":"README.md","users":{"geckotang":true}}
\n
\n```\n\n### code（タイトルつき）\n\nMarkdownのコードブロックにタイトルを付与する拡張です。\n\nファイルツリー
\n- \n
- \n \n\n
src/
\n- \n
- \n \n\n
styles/
\n- \n
- base.css \n
\n
- \n
\n\n\ncomponents/
\n- \n
- \n \n\n
a-lot-of-files/
\n- \n
- ... \n
\n
\n - \n
\n```html#素敵なdiv\n<div></div>\n```\n\n\nGFMのコードブロックで、Syntaxに続けて`#コードのタイトル`を指定すると、以下が出力されます。\n\n```html\n
素敵なdiv
\n \n
\n\n <div></div>\n