Cursor rules を使いこなそう

こんにちは、AI と生きる Gemini の友達。よしざわです。
Gaji-Labo ではプロダクトチームを支援するために AI を活用について日々議論や研究を行っています。 今回は AI 支援機能を搭載したコードエディタである Cursor の機能である Cursor rules を活用したお手軽な開発効率化についてお話ししようと思います。

Cursor rules とは

Cursor 公式の説明を引用すると「再利用可能なスコープ付き命令」です。私はこれを、「常駐型のルール」と「プロンプトのショートカット」を作る機能だと理解しています。

常駐型のルール

Cursor では AI が自動でコンテキストに組み込むプロンプトを Cursor rules で設定することができます。設定でルールのタイプを下記の4種類からの設定ができます。これにより、ルールを適応するケースを限定できます。公式がスコープ付きと表現しているのがこの機能です。

私は上記の Manual 以外を選んだ場合を常駐型のルールと呼んでいます。常駐型のルールは使い方が難しいですが、AI が生成するコードのフォーマットを統一するルールなどは使いやすいと思います。

下記は例です。

---
description: 
globs: *.tsx
alwaysApply: false
---
コンポーネントは以下の形式で作成してください。

```TypeScript:HogeHuga.tsx

export interface HogeHugaProps {
  prop1: string
}

export const HogeHuga = ({ prop1 }: HogeHugaProps) => {
  return <>sample</>
}
```%     

プロンプトのショートカット

常駐型のルールで表示したルールタイプのうち Manual を選んだ場合のルールをプロンプトのショートカットと呼んでいます。なぜあえて常駐型のルールと区別しているのかというと、プロンプトのショートカットは常駐型のルールと違い圧倒的に使いやすく、開発にも組み込みやすいからです。

プロンプトのショートカットはその呼び方の通り、再利用性の高いプロンプトを予め登録しておいて任意のタイミングでコンテキストとして呼び出すことができる機能です。

特におすすめの使い方として、コンポーネントやテスト、 StoryBook などの雛形のファイルを登録しておいて新規ファイル作成時に AI に命名などを修正した雛形を作成してもらう使い方があります。

これは公式もドキュメントに記載している使い方で、プロンプトを工夫することでファイル名や関数名を自動で調整したテンプレートを作成してくれるため、雛形をコピペしてファイル置換を行う手間などを省略してスムーズに開発を行うことができます。

下記は私が利用している StoryBook 自動生成のルールです。

---
description: 
globs: 
alwaysApply: false
---
# storybook雛形作成
以下のフォーマットでstorybookを作成して下さい。

```
import React from 'react';
import type { Meta, StoryObj } from '@storybook/react';
import { Xxxx } from '@/screens/hoge/Xxxxx';

const meta: Meta<typeof Xxxx> = {
  title: 'Screens/hoge/Xxxx',
  component: Xxxx,
};

export default meta;

type Story = StoryObj<typeof Xxxx>;

export const Default: Story = {
  render: () => {
    return <Xxxx />;
  },
};
```

ディレクトリ名hogeやコンポーネント名Xxxxは実際のコンポーネントに状態に合わせて修正する。%  

Storybookを生成したいコンポーネントとこのルールをコンテキストに含めただけの状態でチャットをすると自動で雛形に沿って StoryBook を作成してくれます。

テンプレート作成におすすめなカスタムエージェント

Cursor Rules のプロンプトのショートカットを作成する機能を使うことで、テンプレートファイルを簡単に生成できることを紹介しました。

ただし thinking がついたモデルや Cursor デフォルトのエージェントは、良かれと思ってテンプレートに修正を加えることがあります。そのためベータ版機能であるものの、Custom Modes を利用して指示以外のことを実行しないエージェントを作成して利用することがおすすめです。

以下は私が作成して使っているカスタムエージェントのプロンプトです。モデルは gpt-4.1 を利用しています。

指示されたことだけを迅速かつ忠実に実行してください。

ツールはファイル編集用に Edit > Edit & Reapply とコマンド実行を伴うワークフローを設定することもあるため、 Run > Terminal を有効にしています。

まとめ

Cursor rules はお手軽に開発ワークフローを効率化する可能性のある夢のある機能です。まだまだ研究途中な部分もあり特に常駐型のルールに関しては可能性を探っているレベルではありますが、 AI の発展やそれに伴う開発環境の変化に追従して、今後も常に最適な開発スタイルを提供し続けたいと考えています。