Raycast Extension開発:AIコマンドをMacのランチャーに追加する方法
Macユーザーの間で、Alfredと並んで(あるいはそれ以上に)支持を集めているランチャーアプリ「Raycast」。その魅力は、Reactを使った拡張機能(Extension)のエコシステムにあります。
今回は、RaycastのAPIを使って、自分だけの「AIコマンド」を作成する方法を解説します。例えば、「選択中のテキストを要約する」「クリップボードの内容をコードレビューする」といった機能を、ショートカット一発で呼び出せるようになります。
開発環境のセットアップ
Raycast Extensionは、Node.js、TypeScript、Reactで開発します。
# プロジェクトの作成
npx @raycast/api@latest create my-ai-extension
# ディレクトリへの移動
cd my-ai-extension
# 開発サーバーの起動
npm run dev
これで、Raycast上で開発中のコマンドが呼び出せるようになります。
実装例:選択テキストをAIで修正するコマンド
「選択中のテキストを取得し、OpenAI APIに送信して、修正結果をクリップボードにコピーする」というシンプルなコマンドを作ってみましょう。
1. 必要なパッケージのインストール
OpenAI公式ライブラリを追加します。
npm install openai
2. コマンドの実装
src/index.tsx を以下のように編集します。
import { getSelectedText, Clipboard, showToast, Toast } from "@raycast/api";
import OpenAI from "openai";
const openai = new OpenAI({
apiKey: "YOUR_OPENAI_API_KEY", // 本番ではPreferences APIを使用しましょう
});
export default async function Command() {
try {
// 1. 選択テキストの取得
const selectedText = await getSelectedText();
await showToast({
style: Toast.Style.Animated,
title: "AI修正中...",
});
// 2. AIによる処理
const completion = await openai.chat.completions.create({
messages: [
{ role: "system", content: "入力されたテキストの誤字脱字を修正し、自然な日本語にしてください。" },
{ role: "user", content: selectedText },
],
model: "gpt-4-turbo",
});
const fixedText = completion.choices[0].message.content;
// 3. 結果をクリップボードにコピー(または貼り付け)
if (fixedText) {
await Clipboard.copy(fixedText);
await showToast({
style: Toast.Style.Success,
title: "修正完了!",
message: "クリップボードにコピーしました",
});
}
} catch (error) {
await showToast({
style: Toast.Style.Failure,
title: "エラーが発生しました",
message: String(error),
});
}
}
AI機能を強化するTips
Preferences APIの活用
APIキーをコードに直書きするのは危険です。RaycastのPreferences APIを使って、ユーザーに入力させましょう。
package.json に設定項目を追加します。
"preferences": [
{
"name": "apiKey",
"description": "Enter your OpenAI API Key",
"type": "password",
"required": true,
"title": "API Key"
}
]
コード側では getPreferenceValues で取得できます。
標準AI機能との差別化
Raycastには標準で「Raycast AI」が搭載されています。自作Extensionの強みは、特定のワークフローに特化できることです。
- 社内APIとの連携: 社内のドキュメント検索APIを叩いて結果を表示する。
- 複雑なプロンプトチェーン: 複数のAIモデルを順次呼び出して、高度な処理を行う。
ストアへの公開
完成したExtensionは、GitHubリポジトリを通じて公式ストア(Raycast Store)に申請できます。審査は比較的早く、世界中のユーザーに使ってもらえるチャンスです。
自分だけの最強ランチャーを作り上げて、生産性を極限まで高めましょう!