tRPC クライアント Devtools:クエリ、ミューテーション、およびサブスクリプションの検査のための非公式拡張機能
tRPC Client Devtoolsは、開発者がtRPCアプリケーションのクエリ、ミューテーション、サブスクリプションを検査することができる非公式の拡張機能です。このChrome拡張機能は、これらの操作の入力、出力、経過時間を分析する便利な方法を提供します。
tRPC Client Devtoolsを使用するには、数少ない簡単な手順があります。まず、trpc-client-devtools-link npmパッケージをインストールし、tRPCクライアントの設定に追加します。tRPC v10を使用している場合は、@nextバージョンをインストールすることを確認してください。次に、tRPC Client Devtools拡張機能をダウンロードしてインストールします。最後に、ブラウザのDevtoolsを開き、tRPCパネルに移動してクエリ、ミューテーション、サブスクリプションを検査を開始します。
インストールすると、tRPC Client Devtoolsは、他のタブ(「要素」や「コンソール」など)と並んで、ウェブブラウザのインスペクターに「tRPC」タブとして表示されます。この拡張機能には、クエリインスペクター、ミューテーションインスペクター、サブスクリプションインスペクターの3つの主要な機能があります。これらの機能により、発火したクエリ、ミューテーション、サブスクリプションの入力、結果、経過時間を表示することができます。