最初の拡張機能を作る
シンプルな「Hello World」を表示するボタンを追加して、拡張機能の基本を学びましょう。
1
JavaScript ファイルの作成
任意の場所に新しい JavaScript ファイルを作成します（例: hello-world.js）。
以下のコードをコピーして貼り付けてください。これが拡張機能の本体です。
1(function(api) {
2 // 拡張機能が読み込まれたときの処理
3 console.log('Hello World Extension loaded');
4
5 // ヘッダーにボタンを追加
6 api.registerHeaderButton({
7 id: 'hello-world-btn',
8 icon: 'Star', // Lucide icon name
9 label: 'Hello',
10 onClick: () => {
11 // クリック時に通知を表示
12 api.showNotification('Hello World!', 'success');
13 }
14 });
15
16 // クリーンアップ関数（無効化時に実行）
17 return function cleanup() {
18 console.log('Hello World Extension unloaded');
19 };
20})- •全体を即時関数 (IIFE) で囲み、グローバル汚染を防ぎます。
- •引数
apiを通じてアプリの機能を呼び出します。 - •
cleanup関数を返すと、拡張機能が無効化されたときに実行されます。
2
アプリへの読み込み
作成したファイルをアプリに読み込みます。
- Tsudzuri を起動し、左下の設定アイコン（settings）をクリックします。
- 設定メニューから「拡張機能」を選択します。
- 右上の「拡張機能を追加」ボタンをクリックします。
- 先ほど作成した
hello-world.jsを選択します。
3
動作確認
拡張機能が正しく読み込まれると、一覧に「hello-world」が表示されます。
ヘッダー（画面右上）にスターアイコン（★）が追加されていることを確認してください。 それをクリックすると、「Hello World!」という緑色の通知が表示されれば成功です！