2
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

AIがバリバリコードを書いてくれるCursorのComposer機能について

Last updated at Posted at 2024-11-14

Composerの起動

Cmd + i で起動

基本的な流れ

Composerの部分で指示を書き、Apply Allすれば変更点をすべて保存できます。
ただし戻すことがとても大変なので、一度修正する毎にコミットするぐらいの感覚でGit管理しておいたほうが良いです。

部分的な修正

コードを範囲選択し、Cmd+k をすると部分的な修正が可能。

Screenshot 2024-11-15 at 0.21.14.png

長い文章でいれる

月々の利用量にリミットがあるらしく、リクエスト数で決まるらしいです。そのため可能な限り長い文章で正確に指示を与えると効率的です。

モデルの選択

右下部分にあるLLM(モデル)の選択が可能。現在だと claude-3-5-sonnet 系が良いのではないかな。

image.png

composer.md

Composerではやり取りの前提条件を都度読み込める仕組みになっています。
プロンプトに相当する事前定義をファイルに纏めておいてプロジェクトに一緒に入れておくと良いです。

composer.md
Next.jsのコードを配置するディレクトリは、 /refine/src/app 以下です。

.cursorrules

こちらは必ず自動的に読み込まれるプロンプトです。

Cursor Directory というサイトに各言語の一覧があるので、ここから好きなruleを拾ってきて入れておくと良いです。

注意点として、Directoryに記載されいているrulesは、表題以外のフレームワーク(Reactを選んだときのNext.jsやShadcn)の指定などがはっきりしており、自分が思った以上に指定されることがあるので注意が必要です。

例えばReactベースのrulesを拾ってきてそこにShadcnを使う指定があった場合、プロンプトでMUIを使えといってもShadcnを使われてしまったりします。
面倒ですが基本的なルールなのでリポジトリなどに取り入れる際には精査をしたほうが良いです。

Codebase indexing

設定画面からコードインデックスの状況を確認したり除外することができます。

image.png

自分でコードを書き換えたりした場合にもインデックスを更新しておくと、そのコードとの互換性を保って新しいコードを書いてくれるようになります。

Docs

同じく設定画面から、Docsに公式ドキュメントのURLを入れて設定しておくと参照してくれます。

image.png

インデックス状況も確認できます。

image.png

Chat (Cmd + l)

ファイルを勝手に編集されたくない場合にはChatでやり取りできます。
@commit をするとコミットをみてコミットログを書いてくれます。

image.png

Yoloモードを有効化する

Yoloモードを有効にし、許可を追加するとシェルコマンドなどをComposerから実行することができます。

有効化するにはメニューバーのCursor Settingsから行います。(⌘ + , で開く設定はVS Code Settingsなので違います)
Cusor > Cursor Settings から Enable Yolo Mode にチェックをいれておきm

2
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?