10分で終わる!? 既存MCPサーバーのDXT (Desktop Extensions) 化 実践ガイド
最終成果物
なぜDXT化するのか
MCP(Model Context Protocol)サーバーの配布は、これまでセットアップ手順の複雑さが課題でした。
開発者は詳細なインストール手順書を作成し、エンドユーザーは慎重な設定作業を強いられていました。
そんな中、Anthropic社が発表した DXT (Desktop Extensions) は、この状況を打破するかもと評判の仕様です。
アプリケーションのインストーラのように、.dxt ファイルをダブルクリックするだけでMCPサーバーのインストールが終わります。
この記事では、私が実際にTouchDesigner MCPをDXT化した体験をもとに、具体的な手順と遭遇した課題、そして公式ドキュメントには記載されていない npxベースのMCPサーバーをDXT化する手法について紹介します。
TouchDesignerと非エンジニアユーザーの課題
TouchDesignerは、メディアアーティスト、VJ、インタラクティブデザイナーなど、必ずしもプログラミング経験が豊富でないクリエイターも利用するアプリケーションです。
自由度が高い反面、その学習コストも高いため細々とMCPサーバーを開発しています。
しかし、従来のMCPサーバーインストールには、ターミナルでのコマンド実行や、JSONファイルの手動編集、複雑な設定手順の理解などが必要で、実際にユーザーから課題として指摘されていました。
TouchDesigner MCPリポジトリへのGitHubのIssueやYouTubeコメントで、「インストール手順が分かりにくい」「設定が複雑すぎる」といったフィードバックが度々寄せられていました。
これを受けて解説動画も制作しましたが、それでも全ユーザーが理解できるとは言い難い状況でした。
「ターミナルって何?」というところから説明が必要だったり、JSONファイルの編集でシンタックスエラーが発生したりと、つまずくユーザーさんもいました。
また、AIエージェントやMCPのエコシステム自体が成長の過渡期であることからエージェントごとにMCPの設定ファイルが異なってサポートしきれない、といった問題もあります。
DXTによる「ワンクリックインストール」は、こうした非エンジニア層の実際の課題を解決してくれる仕組みです。
DXTの基本概念
DXT(Desktop Extensions)は、MCPサーバーを標準化された形式で配布するためのオープンソース仕様です。
DXTの特徴
DXTの基本構造は .dxtファイル = zipアーカイブ + manifest.json というシンプルなものです。
これはChrome拡張やVS Code拡張と同様のアプローチで、既存の拡張システムと親和性が高い設計になっています。
Node.js、Python、バイナリ実行ファイルなど複数言語に対応しており、必要な依存関係も一緒にパッケージングして自動管理できます。
従来の課題とDXTの解決策
従来の課題
# 複雑なセットアップ手順
npm install -g touchdesigner-mcp
# Claude Desktopの設定ファイル編集
# 長いJSON設定の追加...
DXTでの解決
# ワンクリックインストール
touchdesigner-mcp.dxt をダウンロード → ダブルクリック → Claude Desktopで承認 → 完了
実際のDXT化プロセス
環境準備
公式ドキュメントを参照いただくのが最も確実なので割愛します。
DXT化の実装
1. マニフェストの初期化
# プロジェクトルートで実行
dxt init
対話形式でセットアップを進めると、このような基本的なmanifest.jsonが生成されます。
{
"dxt_version": "0.1",
"name": "touchdesigner-mcp-server",
"version": "0.4.1",
"description": "MCP server for TouchDesigner",
"author": {
"name": "8beeeaaat"
},
"server": {
"type": "node",
"entry_point": "dist/index.js",
"mcp_config": {
"command": "node",
"args": [
"${__dirname}/dist/index.js"
],
"env": {}
}
},
"license": "MIT",
"repository": {
"type": "git",
"url": "git+https://github.com/8beeeaaat/touchdesigner-mcp.git"
}
}
2. manifest.jsonの設定
その後、toolやpromptなどマニフェストの項目を細かく詰めていくことになるのですが、ここで思わぬ発見がありました。
npxで公開しているMCPサーバーのマニフェスト
通常のDXTマニフェスト では、mcp_config にMCPサーバーのエントリーファイルを指定するようになっているのですが、npxで利用可能なMCPサーバーの場合は以下の指定だけで完結します。
npx を利用することで、DXT化のプロセスがかなり簡素化されます。
node_modules を同梱する必要がなくnpmエコシステムがすべて管理してくれますし、複雑なパス指定や実行環境の設定からも解放されます。
必要な記述はサーバーのnpmパッケージ名を示す args の指定だけ。
パッケージのファイルサイズ
npxを使う利点はもう一つあって、ファイルサイズが小さくなります。
TouchDesigner MCPサーバーと同一リポジトリで開発しているため、そのまま何も考えずにpackするとDXTに内包する必要のない /node_modules やソースファイルもバンドルされてしまいます。
当初は manifest.json をリポジトリのルートに配置していたため、TouchDesigner MCPのソースコード全体がパッケージされ80MB以上のファイルになってしまいました。
一方、npx方式のパッケージングでは依存関係はnpmエコシステムに委任することで、最終的に1.5KBまで軽量化できました。
80MB → 1.5KB、約5万分の1です。
manifest.jsonだけあれば良い
.dxtignoreでの除外には限界があったため、最終的に別ディレクトリにmanifest.jsonだけを配置する方法で行き着くところまで軽量化しました。
dxt/ディレクトリを作成してmanifest.jsonのみを配置し、以下のコマンドでパッケージングしています。
npx @anthropic-ai/dxt pack dxt/ touchdesigner-mcp.dxt
結果はこんな感じです。
📦 touchdesigner-mcp@0.1.1
Archive Contents
3.9kB ../manifest.json
Archive Details
name: touchdesigner-mcp
version: 0.1.1
filename: touchdesigner-mcp-0.1.1.dxt
package size: 1.5kB
unpacked size: 3.9kB
total files: 1
ignored (.dxtignore) files: 0
CI/CDでのビルド自動化
GitHub Actionsワークフローを更新し、リリース時に自動で.dxtファイルを生成してアップロードするよう設定しました。
実際の成果物はGitHub Releasesで確認できます。
touchdesigner-mcp.dxtファイルが自動で生成され、配布されています。
遭遇した問題と解決策
署名エラーの問題
DXT化の過程で、最も大きな問題となったのが署名(signing)の不具合です。
# 署名は成功と表示される
$ dxt sign touchdesigner-mcp.dxt
Successfully signed touchdesigner-mcp.dxt
# しかし検証で失敗する
$ dxt verify touchdesigner-mcp.dxt
ERROR: Extension is not signed
この問題は、自己署名証明書でも独自証明書でも同様に発生しました。
DXTエコシステム全体に影響する可能性があるため、Issueとして報告しました。
ひとまず無署名で頒布していますが、信頼性に関わるので早く解決したい...。
DXT化で何が変わったか
インストールの手順
従来の手順(非エンジニアだと約10分〜?)
# 1. グローバルインストール
npm install -g touchdesigner-mcp
# 2. Claude Desktop設定ファイルの編集
# ~/Library/Application Support/Claude/claude_desktop_config.json
# 3. 複雑なJSON設定の追加
{
"mcpServers": {
"touchdesigner-mcp": {
"command": "npx",
"args": ["touchdesigner-mcp"]
}
}
}
# 4. Claude Desktopの再起動
DXT導入後(1分以内)
1. GitHub Releasesからtouchdesigner-mcp.dxtをダウンロード
2. Claude Desktopで.dxtファイルを開く
3. 完了!
GitHub Releasesでの自動配布
GitHub Actionsによりtouchdesigner-mcp.dxtファイルとtouchdesigner-mcp-td.zip(TouchDesigner用コンポーネント)が自動で生成され、配布されています。
npmパッケージのDXT化の実例
TouchDesigner MCPサーバーのDXT化を通じて、クリエイティブコーディング分野でのAI導入のハードルを下げることができたと思います。
npmパッケージのDXT化についても、ひとつの実例として参考にしていただけるかもしれません。
# 開発者:簡単なマニフェスト設定
{
"command": "npx",
"args": ["your-mcp-server"]
}
# ユーザー:ワンクリックインストール
# .dxtファイルをダブルクリック → 完了
まとめ
署名問題の解決待ち
現在最大の課題は、私が報告した署名検証の問題です。
これが解決されれば、配布された拡張が本物かどうかを確認できるようになりますし、署名を求める組織でも導入しやすくなるはずです。
(おま環だったらすみません...)
npmパッケージからDXT化する手順
npmで公開済みのMCPサーバーなら、manifest.jsonは "args": ["package-name"] の指定だけで済み、.dxtファイルも1.5KBのまま配れます。
今回の経験から、DXT化は次の3ステップで終わることを確認できました。
-
dxt initでプロジェクトのマニフェストを初期化する - manifest.jsonに
"args": ["your-package-name"]を追記する -
dxt pack .で.dxtファイルを生成する
設定ファイルの記述量も最小限で済むので、npxでMCPサーバーを公開している開発者の皆様も試してみる価値は十分にあると思います。
TouchDesignerコミュニティでの普及
TouchDesignerの主要ユーザーである非エンジニア層のクリエイターにとって、DXTの恩恵は大きいと思っています。
メディアアーティストやVJは技術的な設定作業なしでAI支援機能を活用できるようになりますし、教育現場では過去記事で紹介したような学習ハードルに加えてインストールの複雑さも解消されます。
ライブパフォーマンスの現場では本番前の環境構築時間を短縮でき、プロダクション環境でも技術者でなくてもツールを導入できるようになります。
DXT化を終えて
ユーザーの導入手順は10分から1分以内に短くなりました。
署名問題は解決待ちですが、無署名でも配布はできています。
公式ドキュメントにないTipsも見つけることができました。
npmで公開されているMCPサーバーにとって、DXT化は少ない労力で大きな効果を得られる施策だと思います。
今後もDXTエコシステムの発展と、より多くのMCPサーバーでのDXT対応に貢献していきたいと思います。
Discussion