Plugin Hub

Plugin Hub は小さなツールを見つけ、インストールし、実行する場所です。プラグインはウィンドウ付きのスニペットで、他のスニペットと一緒に保存されます。検索ウィンドウの マーケットプレイス タブからも開けます。

@codeexpander/plugin-timestamp

Install

Timestamp

JSON format

json

QR code

Plugin Hub: install by npm package name. A plugin is a snippet with plugin_mode, not a separate table.

プラグインにできること

プラグインは CodeExpander 内で動く小さなアプリケーションです。できること：

カスタムツールを追加 — タイムスタンプ変換、JSON 整形、カラーピッカー、電卓
ファイルを処理 — 検索ウィンドウにファイルをドラッグすると、プラグインが解析して変換
作業の流れに組み込む — QR コード生成、Base64 のエンコード / デコード、SQL 整形
AI 機能を提供 — コードレビュー、自動コメント、テスト生成

プラグインのインストール

npm から（推奨）

プラグインを入れる一番速い方法：

メインウィンドウまたは検索ウィンドウから Plugin Hub を開く
インストール 欄に npm パッケージ名を入力（例：@codeexpander/plugin-timestamp）
インストール をクリック

公式プラグインは @codeexpander/plugin-* 接頭辞を使い、チームがキュレーションします。

要件： システムに Node.js と npm がインストールされていること。

ローカルディレクトリから

マシン上にプラグインフォルダがある場合：

ディレクトリからインポート をクリック
plugin.json とエントリファイルがあるフォルダを選ぶ
プラグインが一覧にすぐ出る

AI から（MCP）

AI にプラグインを作らせます。

設定 → MCP で MCP サーバー を有効化
AI アシスタント（Cursor、Claude Desktop など）を接続
必要なものを説明 — 例：「CSV を Markdown 表に変換するプラグインを作って」
AI がプラグインを生成し、自動インストール

プラグインの管理

閲覧と検索

Plugin Hub はインストール済みプラグインをカードで表示。検索ボックスで絞り込み：

名前 — 例：“timestamp”
カテゴリ — 例：“Developer tools”、“Converters”
説明 — キーワード検索

プラグインの実行

Plugin Hub から — 任意のプラグインカードをクリックして UI を開く
検索ウィンドウから — プラグイン名または定義されたコマンドトリガーを入力
ファイル付き — 検索ウィンドウにファイルをドラッグ。ファイル対応プラグインが自動で起動

ピンと整理

よく使うプラグインをピンし、検索ウィンドウの空状態に出す
あまり使わないプラグインを 非表示 にして散らかりを減らす
アンインストール で完全に削除

プラグインの構成

プラグインは実質、次を持つ特別なスニペットです。

plugin.json — メタデータ（名前、説明、アイコン、カテゴリ、エントリファイル）
エントリファイル — プラグインの UI（HTML/JS）
コマンド — 検索ウィンドウ向けの任意のキーワードトリガー

例：「Timestamp Converter」プラグインは次を定義できます。

コマンド：ts — 検索で ts 1714392000 と打つと即変換
UI：Plugin Hub から開いたときの視覚カレンダーピッカー

自分のプラグインを作る

方法 1：手動（開発者向け）

次のフォルダを作ります。


my-plugin/
  plugin.json    ← manifest
  index.html     ← UI

plugin.json の例：


{
  "main": "index.html",
  "title": "My Plugin",
  "description": "Does something useful",
  "category": "Tools",
  "features": [
    {
      "code": "myCmd",
      "explain": "Run my command",
      "cmds": ["my", "mp"]
    }
  ]
}

Plugin Hub → ディレクトリからインポート で取り込みます。

方法 2：AI 支援（誰でも）

MCP 経由で接続した AI アシスタントにアイデアを説明します。AI が次を担当します。

HTML/JS の作成
マニフェストの作成
自動インストール

プロンプトの例： 「選択テキストの単語数を数えるプラグインを作って。検索ウィンドウ用に wc コマンドを足して。」

セキュリティ

プラグインは小さなウィンドウで動き、メインアプリより権限が少ないです。

スニペットライブラリを直接閲覧できない
クリップボードとトーストは、許可するまで待つ
プラグイン一覧は必要なウィンドウ能力を宣言でき、アプリがそれを強制する

典型的な流れ

開発者ツールキット

インストール：@codeexpander/plugin-timestamp、@codeexpander/plugin-json、@codeexpander/plugin-color

日常：

検索ウィンドウ → ts + タイムスタンプを貼る → 即変換
検索ウィンドウ → json + JSON を貼る → 整形と検証
検索ウィンドウ → color + HEX を貼る → RGB/HSL 変換を見る

コンテンツ作成

インストール：@codeexpander/plugin-qr、@codeexpander/plugin-base64

検索ウィンドウ → qr + URL を貼る → QR コード画像を生成
検索ウィンドウ → b64 + テキストを貼る → Base64 のエンコード / デコード

チームのカスタムプラグイン

チームが内部プラグインを作る例：

社内 API 署名生成
内部ドキュメントテンプレート
デプロイコマンドランナー

npm のプライベートレジストリ、またはローカルディレクトリ同期で共有します。

プラグインバックエンド

ワンクリックで終わるプラグインもあります。少し動き続けるものもあります。設定 → 拡張 → プラグインバックエンド を開き、タイムアウトと同時実行数の上限を付けます。これはこのコンピュータ上に留まります。プラグインウィンドウが触れるファイルは、意図的にメインウィンドウより少ないです。開発中は、設定で許可するローカルフォルダを選びます。

プラグイン開発

「日付を選んで挿入」する小さなツールが欲しい。別製品は入れません。プラグインはプラグインモードがオンのスニペットで、独自の小さなウィンドウを開けます。

Develop snippet plugin

Create from a template, import a folder, or use Cursor + CodeExpander MCP.

1Create a plugin

Use Cursor (MCP)Recommended

Enable the MCP server in Settings, then ask the AI to generate a snippet.

codeexpander-plugins

Public repo: spec and examples.

2Import into CodeExpander

Import from folder

Pick a folder with plugin.json and an entry file.

Choose folder

Import as dev linkLocal dev

Stores the manifest only; files are read live. Limited by dev_plugin_base_dirs.

Choose folder

Plugin Dev window: step 1 create via Cursor MCP; step 2 import folder or soft-link. A plugin is a plugin_mode snippet, not another table.

経路	いつ
プラグイン開発ウィンドウ	テンプレートから手順に従う、またはフォルダをインポート
ローカルフォルダ	許可ディレクトリにマニフェストとエントリページがすでにあり
Plugin Hub	マーケットからインストール。スニペットになる
設定の MCP	エディタの AI に、仕様からスニペットを生成させる

文書化された仕様は 設定 → MCP カードにあります。