はじめに
Claudeで複数ファイルに及ぶコードを生成させる際、1つのコードブロックに複数のパスとコードをまとめられることがあり不便に感じます。
この記事では画像のような生成をしてもらうためのプロンプトを共有します
この形式だと、生成されたコードとパスをそれぞれコピーできて嬉しいです！
結論
以下が実際のプロンプトです。
以下の形式で生成してください
```
[ファイルの相対パス]
```
<antArtifact identifier="[ファイル名]" type="application/vnd.ant.code" language="[プログラミング言語]" title="[ファイルの相対パス]">
[ファイルの内容]
</antArtifact>
要件：
1. 各ファイルパスはコードブロック(```)で囲み、以下の構造を守ってください
- コードブロック開始(```)
- 改行
- ファイルパス
- 改行
- コードブロック終了(```)
2. パスの直後に、対応するファイルの内容をantArtifactタグを使用して生成してください
3. antArtifactタグには以下の属性を設定してください
- identifier：ファイル名を基にした一意の識別子
- type："application/vnd.ant.code" を指定
- language：使用するプログラミング言語
- title：ファイルの相対パス
詳細
コードブロック部分
```
[ファイルの相対パス]
```
1. 各ファイルパスはコードブロック(```)で囲み、以下の構造を守ってください
- コードブロック開始(```)
- 改行
- ファイルパス
- 改行
- コードブロック終了(```)
このように改行を明確に指示しないと、下記のようにファイルパスがコピーしにくいコードスパン形式で表示されることがありました。
アーティファクト部分
<antArtifact identifier="[ファイル名]" type="application/vnd.ant.code" language="[プログラミング言語]" title="[ファイルの相対パス]">
[ファイルの内容]
</antArtifact>
<antArtifactタグを指定することで、コード内容をアーティファクトとして表示させています。
応用
パスを指定して新規ファイル作成やジャンプのできるVSCode拡張機能(advanced-new-file
)を使うとコピーしたパスを有効活用できます。
課題
コピーボタンやアーティファクトを切り替えるためにマウスを使う手間自体は増えています。
上記操作をショートカットできるブラウザ拡張機能を用意すれば軽減できそうです