<p data-line="1" class="code-line">カスタムコマンドは、よく使うプロンプトを <code>/コマンド名</code> で呼び出せるようにする機能です。</p>
<p data-line="3" class="code-line">この記事では、その作り方と使い方を解説します。</p>
<h2 id="%E6%9C%80%E9%80%9F%E3%81%A7%E8%A9%A6%E3%81%99" data-line="6" class="code-line"><a class="header-anchor-link" href="#%E6%9C%80%E9%80%9F%E3%81%A7%E8%A9%A6%E3%81%99" aria-hidden="true"></a> 最速で試す</h2>
<p data-line="8" class="code-line">カスタムコマンドは、<code>.claude/commands/</code> フォルダにMarkdownファイルを置くだけで作ることができます。</p>
<p data-line="10" class="code-line">まずはフォルダを作成しましょう。</p>
<div class="code-block-container"><pre class="language-shell"><code class="language-shell code-line" data-line="12"><span class="token function">mkdir</span> <span class="token parameter variable">-p</span> .claude/commands
</code></pre></div><p data-line="16" class="code-line">次に、コマンドとして使いたい内容をMarkdownファイルに保存します。</p>
<p data-line="18" class="code-line">例として、コードレビュー用のコマンドを作ってみます。</p>
<div class="code-block-container"><pre class="language-shell"><code class="language-shell code-line" data-line="20"><span class="token builtin class-name">echo</span> <span class="token string">"このコードをレビューしてください。バグ、パフォーマンス、可読性の観点でチェックして。"</span> <span class="token operator">&gt;</span> .claude/commands/review.md
</code></pre></div><aside class="msg message"><span class="msg-symbol">!</span><div class="msg-content"><p data-line="25" class="code-line">コピペでできるようにあえてコマンドで作っていますが、オリジナルで作る場合はテキストエディタで直接作成した方が楽です。</p>
</div></aside>
<p data-line="28" class="code-line">最後に、Claude Codeを起動（再起動）してチャットで以下のように入力します。</p>
<div class="code-block-container"><div class="code-block-filename-container"><span class="code-block-filename">Claude Code</span></div><pre class="language-shell"><code class="language-shell code-line" data-line="30">/review
</code></pre></div><p data-line="34" class="code-line">これで、<code>/review</code> で保存したプロンプトが実行されます。</p>
<h2 id="%E5%9F%BA%E6%9C%AC%E7%9A%84%E3%81%AA%E8%80%83%E3%81%88%E6%96%B9" data-line="37" class="code-line"><a class="header-anchor-link" href="#%E5%9F%BA%E6%9C%AC%E7%9A%84%E3%81%AA%E8%80%83%E3%81%88%E6%96%B9" aria-hidden="true"></a> 基本的な考え方</h2>
<p data-line="38" class="code-line">上記ではサクッと使ってみる方法を紹介しましたが、ここからはカスタムコマンドの仕組みと応用的な使い方を解説します。</p>
<h3 id="%E4%BF%9D%E5%AD%98%E5%A0%B4%E6%89%80%E3%81%AF2%E7%A8%AE%E9%A1%9E" data-line="40" class="code-line"><a class="header-anchor-link" href="#%E4%BF%9D%E5%AD%98%E5%A0%B4%E6%89%80%E3%81%AF2%E7%A8%AE%E9%A1%9E" aria-hidden="true"></a> 保存場所は2種類</h3>
<p data-line="41" class="code-line">Claude Codeのカスタムコマンドは、2つの場所に保存できます。</p>
<p data-line="43" class="code-line">これによって、プロジェクトごとに共有するコマンドと、自分専用のコマンドを使い分けられます。</p>
<table data-line="45" class="code-line">
<thead data-line="45" class="code-line">
<tr data-line="45" class="code-line">
<th>種類</th>
<th>場所</th>
<th>用途</th>
</tr>
</thead>
<tbody data-line="47" class="code-line">
<tr data-line="47" class="code-line">
<td>プロジェクト用</td>
<td><code>.claude/commands/</code></td>
<td>このプロジェクトだけで使う。Gitで共有可能</td>
</tr>
<tr data-line="48" class="code-line">
<td>個人用</td>
<td><code>~/.claude/commands/</code></td>
<td>全プロジェクトで使える。自分専用</td>
</tr>
</tbody>
</table>
<p data-line="50" class="code-line">コマンドはあくまでプロンプトを保存するだけであり、個人のやり方に依存する部分が多いと思うので、最初は個人用に作るのがベターかと思います。</p>
<p data-line="52" class="code-line">共有が必要になったら、プロジェクト用にコピーすればOKです。</p>
<h3 id="%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E5%90%8D-%3D-%E3%82%B3%E3%83%9E%E3%83%B3%E3%83%89%E5%90%8D" data-line="54" class="code-line"><a class="header-anchor-link" href="#%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E5%90%8D-%3D-%E3%82%B3%E3%83%9E%E3%83%B3%E3%83%89%E5%90%8D" aria-hidden="true"></a> ファイル名 = コマンド名</h3>
<p data-line="56" class="code-line">ファイル名がそのままコマンド名になります。</p>
<p data-line="58" class="code-line">例えば、以下のようになります。</p>
<ul data-line="60" class="code-line">
<li data-line="60" class="code-line"><code>review.md</code> → <code>/review</code></li>
<li data-line="61" class="code-line"><code>create-test.md</code> → <code>/create-test</code></li>
<li data-line="62" class="code-line"><code>fix-bug.md</code> → <code>/fix-bug</code></li>
</ul>
<h2 id="%E5%BC%95%E6%95%B0%E3%82%92%E4%BD%BF%E3%81%86" data-line="65" class="code-line"><a class="header-anchor-link" href="#%E5%BC%95%E6%95%B0%E3%82%92%E4%BD%BF%E3%81%86" aria-hidden="true"></a> 引数を使う</h2>
<p data-line="66" class="code-line">カスタムコマンドには引数を渡すことで、オプションを指定したり、柔軟に動作させたりできます。</p>
<p data-line="68" class="code-line">引数はプロンプト内で以下のように参照できます。</p>
<h3 id="%E6%B8%A1%E3%81%95%E3%82%8C%E3%81%9F%E5%BC%95%E6%95%B0%E3%82%92%E3%81%99%E3%81%B9%E3%81%A6%E5%8F%97%E3%81%91%E5%8F%96%E3%82%8B" data-line="70" class="code-line"><a class="header-anchor-link" href="#%E6%B8%A1%E3%81%95%E3%82%8C%E3%81%9F%E5%BC%95%E6%95%B0%E3%82%92%E3%81%99%E3%81%B9%E3%81%A6%E5%8F%97%E3%81%91%E5%8F%96%E3%82%8B" aria-hidden="true"></a> 渡された引数をすべて受け取る</h3>
<p data-line="72" class="code-line">$ARGUMENTS で、渡された引数をすべて受け取ることができます。</p>
<div class="code-block-container"><div class="code-block-filename-container"><span class="code-block-filename">.claude/commands/fix-issue.md</span></div><pre class="language-md"><code class="language-md code-line" data-line="74">GitHub Issue #$ARGUMENTS を確認して修正してください。
</code></pre></div><p data-line="78" class="code-line">上記を使う場合は下記のようにします。</p>
<div class="code-block-container"><pre><code class="code-line" data-line="80">/fix-issue 123
</code></pre></div><p data-line="84" class="code-line"><code>$ARGUMENTS</code> が <code>123</code> に置き換わります。</p>
<h3 id="%E5%80%8B%E5%88%A5%E3%81%AB%E5%8F%97%E3%81%91%E5%8F%96%E3%82%8B" data-line="86" class="code-line"><a class="header-anchor-link" href="#%E5%80%8B%E5%88%A5%E3%81%AB%E5%8F%97%E3%81%91%E5%8F%96%E3%82%8B" aria-hidden="true"></a> 個別に受け取る</h3>
<p data-line="88" class="code-line">渡された引数を個別に受け取ることもできます。</p>
<p data-line="90" class="code-line">その場合は、$1、$2、$3... のように番号で参照します。</p>
<div class="code-block-container"><div class="code-block-filename-container"><span class="code-block-filename">.claude/commands/create-component.md</span></div><pre class="language-md"><code class="language-md code-line" data-line="92">$1 という名前の$2コンポーネントを作成してください。
</code></pre></div><p data-line="96" class="code-line">上記を使う場合は下記のようにします。</p>
<div class="code-block-container"><pre><code class="code-line" data-line="98">/create-component UserProfile React
</code></pre></div><ul data-line="102" class="code-line">
<li data-line="102" class="code-line"><code>$1</code> → <code>UserProfile</code></li>
<li data-line="103" class="code-line"><code>$2</code> → <code>React</code></li>
</ul>
<p data-line="105" class="code-line">上記の例はあまり使い物にならないかもしれませんが、引数を分けて受け取りたい場合に便利です。</p>
<h2 id="%E4%BE%BF%E5%88%A9%E3%81%AB%E4%BD%BF%E3%81%86" data-line="107" class="code-line"><a class="header-anchor-link" href="#%E4%BE%BF%E5%88%A9%E3%81%AB%E4%BD%BF%E3%81%86" aria-hidden="true"></a> 便利に使う</h2>
<p data-line="108" class="code-line">ここからは、カスタムコマンドをより便利に使う方法を紹介します。</p>
<h3 id="bash%E3%82%B3%E3%83%9E%E3%83%B3%E3%83%89%E3%81%AE%E5%AE%9F%E8%A1%8C" data-line="110" class="code-line"><a class="header-anchor-link" href="#bash%E3%82%B3%E3%83%9E%E3%83%B3%E3%83%89%E3%81%AE%E5%AE%9F%E8%A1%8C" aria-hidden="true"></a> Bashコマンドの実行</h3>
<p data-line="112" class="code-line"><code>!`コマンド`</code> と書くと、コマンド実行時にBashが走り、その結果がプロンプトに埋め込まれます。</p>
<div class="code-block-container"><div class="code-block-filename-container"><span class="code-block-filename">.claude/commands/commit.md</span></div><pre class="language-md"><code class="language-md code-line" data-line="114"><span class="token front-matter-block"><span class="token punctuation">---</span>
<span class="token front-matter yaml language-yaml"><span class="token key atrule">allowed-tools</span><span class="token punctuation">:</span> Bash(git diff<span class="token punctuation">:</span><span class="token important">*)</span><span class="token punctuation">,</span> Bash(git status<span class="token punctuation">:</span><span class="token important">*)</span></span>
<span class="token punctuation">---</span></span>

<span class="token title important"><span class="token punctuation">##</span> 現在の変更</span>
!<span class="token code-snippet code keyword">`git diff --staged`</span>

この変更に対して適切なコミットメッセージを提案して。
</code></pre></div><p data-line="125" class="code-line">こうすることで、「今の状態」を自動で取得できます。</p>
<div class="code-block-container"><div class="code-block-filename-container"><span class="code-block-filename">Clade Code</span></div><pre class="language-shell"><code class="language-shell code-line" data-line="127">/commit
</code></pre></div><p data-line="130" class="code-line">上記を実行すると、自動でdiffが取得されて、それを元に提案してくれます。</p>
<aside class="msg alert"><span class="msg-symbol">!</span><div class="msg-content"><p data-line="133" class="code-line">Bashを使うには <code>allowed-tools</code> の指定が必要です。</p>
</div></aside>
<h3 id="%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E5%8F%82%E7%85%A7" data-line="136" class="code-line"><a class="header-anchor-link" href="#%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E5%8F%82%E7%85%A7" aria-hidden="true"></a> ファイル参照</h3>
<p data-line="138" class="code-line"><code>@ファイルパス</code> で、そのファイルの中身をプロンプトに含めることができます。</p>
<div class="code-block-container"><pre class="language-markdown"><code class="language-markdown code-line" data-line="140">@$ARGUMENTS のテストを書いてください。
</code></pre></div><p data-line="144" class="code-line">下記の通りClaude Codeでコマンドを実行します。</p>
<div class="code-block-container"><div class="code-block-filename-container"><span class="code-block-filename">Claude Code</span></div><pre class="language-shell"><code class="language-shell code-line" data-line="146">/test src/utils.ts
</code></pre></div><p data-line="150" class="code-line">こうすることで、引数で指定したファイル(<code>src/utils.ts</code>)の中身 を自動で読み込めます。</p>
<p data-line="152" class="code-line">他の指示と組み合わせると便利です。</p>
<h3 id="%E3%83%95%E3%83%AD%E3%83%B3%E3%83%88%E3%83%9E%E3%82%BF%E3%83%BC" data-line="154" class="code-line"><a class="header-anchor-link" href="#%E3%83%95%E3%83%AD%E3%83%B3%E3%83%88%E3%83%9E%E3%82%BF%E3%83%BC" aria-hidden="true"></a> フロントマター</h3>
<p data-line="156" class="code-line">ファイル先頭に <code>---</code> で囲んだ設定を書けます。</p>
<div class="code-block-container"><pre class="language-markdown"><code class="language-markdown code-line" data-line="158"><span class="token front-matter-block"><span class="token punctuation">---</span>
<span class="token front-matter yaml language-yaml"><span class="token key atrule">description</span><span class="token punctuation">:</span> コードをレビューする
<span class="token key atrule">argument-hint</span><span class="token punctuation">:</span> <span class="token punctuation">[</span>ファイルパス<span class="token punctuation">]</span>
<span class="token key atrule">allowed-tools</span><span class="token punctuation">:</span> Bash(npm test<span class="token punctuation">:</span><span class="token important">*)</span></span>
<span class="token punctuation">---</span></span>

$ARGUMENTS をレビューしてください。
</code></pre></div><p data-line="168" class="code-line">こうすることで、以下のような効果があります。</p>
<table data-line="170" class="code-line">
<thead data-line="170" class="code-line">
<tr data-line="170" class="code-line">
<th>項目</th>
<th>効果</th>
</tr>
</thead>
<tbody data-line="172" class="code-line">
<tr data-line="172" class="code-line">
<td><code>description</code></td>
<td><code>/help</code> で「このコマンド何だっけ」がわかる</td>
</tr>
<tr data-line="173" class="code-line">
<td><code>argument-hint</code></td>
<td>コマンド入力時に引数のヒントが表示される</td>
</tr>
<tr data-line="174" class="code-line">
<td><code>allowed-tools</code></td>
<td>Bashコマンド等の実行に許可がいらなくなる</td>
</tr>
</tbody>
</table>
<p data-line="176" class="code-line">これらの方法を組み合わせることで、便利かつ強力なカスタムコマンドを作ることができます。</p>


Claude Code カスタムコマンド(slash command)の作り方と使い方