ReProm:リポジトリをまとめてプロンプト化する CLI
こんにちは、keisukenagakawa です。
この記事では、私が開発した CLI ツール ReProm を紹介します。
ReProm は、指定したディレクトリの構造とファイルの内容をまとめて 1 つの Markdown に出力するためのツールです。ChatGPT などの AI とやりとりをするとき、複数のファイルをいちいちコピペする手間を省き、コードレビューやデバッグを効率化できます。
なぜ作ったのか
AI(特に ChatGPT など)のコードレビュー機能を活用するとき、以下の点に不便さを感じていました。
-
複数ファイルの貼り付けが面倒
コードが複数ファイルに分割されている場合、1 ファイルずつコピーして貼り付けるのは手間がかかる。 -
ディレクトリ構造が伝わりにくい
ファイルの内容だけでは、どんなフォルダに分割しているかなどのプロジェクト構成が伝わりにくい。
こういった問題を解決するために、ディレクトリ構造 + 必要なファイルの中身 をまとめて 1 つの Markdown として出力できる ReProm を作りました。
機能概要
-
ディレクトリ構造の出力
tree
コマンドライクなディレクトリ構造を Markdown のコードブロックに変換します。 -
ファイルの内容をまとめて Markdown に
指定したパターンにマッチしたファイルを全て読み込み、ファイルごとにコードブロックとして 1 ファイルの Markdown に収めます。 -
preText / postText
出力の先頭(preText)や末尾(postText)に自由にメッセージを挿入できます。
例:「以下の構成を見てコードレビューをお願いします。」など。 -
複数設定を YAML で管理
1 つの YAML ファイル内に複数の設定(ディレクトリや除外条件など)を定義できるので、用途に合わせて使い分けられます。 -
出力方法は 2 通り
-
.md
ファイルとしてエクスポート - クリップボードへコピー(Markdown がそのままコピーされるため、すぐにペーストできる)
-
-
TypeScript で実装 & MITライセンス
パブリックに利用・コントリビュート可能です。
インストールと使い方
インストール
既存のプロジェクトに導入する場合は、開発用依存関係としてインストールします。
npm install --save-dev reprom
もしくは Yarn をお使いの場合は
yarn add --dev reprom
設定ファイル(YAML)の準備
プロジェクトルートに reprom.config.yaml
などを作成して、以下のような内容を書きます。
configs:
- name: "sample"
preText: |
これはサンプル設定の出力です。
以下がプロジェクト構成になります。
postText: |
以上がサンプル設定の出力です。
質問があればどうぞ!
targets:
include:
- "src"
exclude:
- "**/node_modules"
filePatterns:
- "**/*.ts"
- "**/*.js"
tree:
maxDepth: 5
directoriesOnly: false
output: "file"
主なフィールド
-
name
: 設定の識別名。CLI で指定して呼び出します。 -
preText
/postText
: Markdown の先頭・末尾に挿入できる文章。 -
targets
: ファイル探索のルール。include
/exclude
でパスを制御し、filePatterns
で拡張子やファイルパターンを指定します。 -
tree
: ディレクトリツリーのオプション。maxDepth
で階層の深さを調整できます。 -
output
:file
なら Markdown ファイルに出力、clipboard
ならクリップボードにコピー。
CLI の実行
npx reprom --config=reprom.config.yaml --name=sample
-
--config
: YAML 設定ファイルへのパス(デフォルトはreprom.config.yaml
)。 -
--name
: 使用する設定名。
output
を "file"
にしている場合は、たとえば reprom-sample.md
という Markdown が生成されます。"clipboard"
ならファイルは生成せず、Markdown はクリップボードにコピーされます。
package.json のスクリプトに追加
同じ設定で何度も実行したい場合は、package.json
にスクリプトを追加しておくと便利です。
{
"scripts": {
"export:sample": "reprom --config=reprom.config.yaml --name=sample"
}
}
npm run export:sample
で実行可能です。
出力イメージ
reprom
を走らせると、以下のような Markdown が生成されます。
- preText
-
ディレクトリ構造(
tree
っぽい表現) - ファイル内容(各ファイルを Markdown のコードブロックとしてまとめる)
- postText
- 文字数のカウント(コンソール表示)
例:
(ここに preText が入る)
# Directory Structure
src
├── config.ts
├── index.ts
└── ...
# File Contents
## src/config.ts
// 実際の config.ts の中身
...
(他のファイルも同様)
(ここに postText が入る)
ソースコード & ライセンス
- GitHub: keisukenagakawa/reprom
- ライセンス: MIT
TypeScript で実装しています。バグ報告や機能要望、プルリクエストなどお待ちしています。
まとめ
ReProm を使えば、複数ファイルに分散したコードを一括して Markdown 化でき、ChatGPT など AI ツールへのコピペ作業をかなり削減できると思います。
コードレビュー、リファクタ相談、学習目的など、多岐にわたって活用いただければ嬉しいです。何か提案やフィードバックがあれば、ぜひ GitHub でお知らせください。
お読みいただきありがとうございました。
Discussion