mcpField
D
devtools-solid

devtools-solid

github.com/vercel-labs開発18.8k101 回インストール5 日前に更新
リポジトリ

devtools-solid について

SolidJS 向けの json-render devtools パネルアダプターです。SolidJS の json-render provider を使うプロジェクトに組み込め、プロダクションビルドでは表示されません。

主な機能

  1. 01SolidJS パネルアダプター
  2. 02json-render provider 内にマウント
  3. 03プロダクションビルドでは非表示
  4. 04Ctrl/Cmd + Shift + J ショートカット

活用シーン

  1. 01SolidJS プロジェクトの json-render の確認
  2. 02ショートカットで devtools パネルを開く

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/vercel-labs/json-render --skill devtools-solid

インストール後、Claude Code で/devtools-solidを入力して読み込まれたか確認します。

詳細

@json-render/devtools-solid

json-render devtools パネル用の SolidJS アダプターです。共通パネルの機能、props、ドッキング動作、サーバーサイドのストリームタップについては、skills/devtools/SKILL.md をお読みください。

インストール

npm install @json-render/devtools @json-render/devtools-solid

パネルをマウントする

既存の SolidJS json-render プロバイダー内に JsonRenderDevtools をマウントします。

import { JsonRenderDevtools } from "@json-render/devtools-solid";

<JSONUIProvider registry={registry}>
  <Renderer spec={spec()} registry={registry} />
  <JsonRenderDevtools
    spec={spec()}
    catalog={catalog}
    messages={messages()}
  />
</JSONUIProvider>;

本番ビルドではコンポーネントは何もレンダリングしません。パネルには、Ctrl/Cmd + Shift + J ショートカットなど、共通の devtools コントロールが用意されています。サーバーサイドのストリーム計装は @json-render/devtools に残してください。

コメント

Markdown 対応