Espanso のスニペットが増えてきて、base.yml を直接編集するのが辛くなってきたので、GUI で管理できるデスクトップアプリ Espanso Manager を作りました。macOS 向けの DMG を GitHub で無料公開しています。


    Espanso Manager とは

    Espanso はオープンソースのテキスト展開ツールです。:ai; と入力すると align-items: center; に展開されたり、<div; と入力すると HTML テンプレートが展開されたりと、コーディングの定型入力を大幅に効率化できます。

    ただ、スニペットが増えてくると管理が大変になってきます。

    • base.yml が数百〜数千行になり、目的のスニペットを探しにくい
    • 複数行の置換テキストのインデント管理がミスしやすい
    • 「このトリガー、前に登録したっけ?」の確認が手間

    Espanso Manager は、これらの問題を解決するための GUI ツールです。aText のような 2 ペイン構成で、コードエディタを開かずにスニペットの検索・編集・追加・削除が完結します。

    Espanso Manager 全体スクリーンショット


    インストール

    macOS 向けの DMG を GitHub Releases で公開しています。

    Releases — sarap422/tauri-espanso-manager

    Apple Silicon Mac の場合は Espanso.Manager_0.1.0_aarch64.dmg をダウンロードしてください。

    初回起動時に macOS のセキュリティ警告が出る場合

    初回起動時に macOS のセキュリティ警告が出る場合は、表示されるメッセージによって対応が異なります。

    「開発元が未確認のため開けません」と表示される場合
    システム設定 → プライバシーとセキュリティ を開き、「Espanso Manager は開発元を確認できないため...」の横にある 「このまま開く」 をクリックしてください。

    「壊れているため開けません」と表示される場合(macOS 14 Sonoma / 15 Sequoia)
    新しい macOS では「このまま開く」が表示されないことがあります。その場合はターミナルで以下のコマンドを実行してください。

    xattr -rc "/Applications/Espanso Manager.app"

    実行後、アプリを普通にダブルクリックで起動できます。


    主な機能

    base.yml の自動読み込みと直接保存

    起動時に ~/Library/Application Support/espanso/match/base.yml を自動で読み込みます。編集後は Cmd+S で直接上書き保存されるので、Export → ファイルを手動でコピーという操作が不要です。

    14カテゴリへの自動分類 + 全文検索

    トリガーのプレフィックスを見て、14 種類のカテゴリに自動分類します。

    プレフィックス カテゴリ 用途
    :: Pseudo CSS 擬似要素
    : CSS Prop CSS プロパティ
    . CSS Class CSS クラス
    <?wp WordPress WordPress 関連 PHP
    <? PHP PHP 全般
    < HTML HTML タグ
    $ JavaScript JS コード
    % Bash Bash コマンド
    #@ Markdown Markdown 記法
    #! Python Python スクリプト
    # Shell シェルスクリプト
    & Symbol HTML 特殊文字
    @ At-rule CSS @ルール
    その他 General 上記以外

    画面上部のチップをクリックするとカテゴリで絞り込めます。検索バーでは trigger と replace の両方を対象に全文検索(部分一致)できます。

    PHP カテゴリで絞り込み、複数行スニペットを編集している様子

    複数行スニペットの編集

    右ペインのテキストエリアは複数行対応で、Tab キーでタブ文字を挿入できます(フォーカス移動ではなく)。85 行・2500 文字を超えるような大きな CSS ブロックや HTML テンプレートも問題なく扱えます。

    検索「shelf」でヒットした85行のCSSスニペットを表示している様子

    未保存インジケーター

    編集中に変更があると、ヘッダーの Save ボタンが青く光り「●」が表示されます。別のスニペットを選択すると自動的に変更が適用されるので、保存忘れの心配がありません。

    未保存状態でSaveボタンが青く光っている様子

    YAML / CSV のインポート・エクスポート

    • .yml — Espanso の base.yml をそのまま読み込み・書き出し
    • .csv — タブ区切りの独自形式。スプレッドシートでの一括編集に便利

    設定画面

    歯車アイコンから設定モーダルを開けます。base.yml のパスをカスタム設定したい場合や、OS 起動時にアプリを自動起動したい場合はここで設定します。

    設定モーダル。base.ymlのパスとOSスタートアップ登録の設定


    技術スタック

    レイヤー 技術
    デスクトップフレームワーク Tauri 2.x
    フロントエンド React 18 + TypeScript
    バックエンド Rust
    ビルドツール Vite

    Tauri は OS の WebView を使うため、Electron と比べてバンドルサイズが大幅に小さくなります(今回の DMG は約 3MB)。バックエンドを Rust で書けるので、ファイルの読み書きや OS との連携を安全に実装できます。

    開発の詳細(Tauri で詰まったポイントや自前 YAML パーサーの実装など)は別の記事で書いています。


    関連記事

    無料で使えるオープンソースのスニペットツール「Espanso」|導入から使い方 PhraseExpressやaTextの代替に最適な、無料・オープンソースのテキスト展開ツール「Espanso」を紹介。インストール方法、基本的な使い方、YAMLでのスニペット登録、特殊文字(n, t, rn)の書き方、macOS/Windowsでのト...  続きを読む Tauri 2.x でデスクトップアプリを作る時にハマったポイントと解決策 Tauri 2.x + React + TypeScriptでデスクトップアプリを開発した際のハマりポイントと解決策。.appが起動しないプラグイン設定の罠、asyncコマンドでのブロッキングI/O、tauri-plugin-storeのAPI変更、CSS-i...  続きを読む

    関連リンク