mcpField
T
threejs-deployment

threejs-deployment

github.com/cesartevisualクラウド・DevOps11323 回インストール7 週間前に更新
リポジトリ

threejs-deployment について

Three.jsアプリのデプロイ準備を行う開発者向けの、ビルドと配信に関するスキルです。アセットパス、キャッシュ、セキュリティポリシー、本番環境での検証を扱い、公開前の権限確認も促します。

主な機能

  1. 01既存のビルド・ホスティング規約の維持
  2. 02Three.js依存関係の互換性確認
  3. 03ビルドに応じたアセットURLの解決
  4. 04クロスオリジンとセキュリティポリシーの設定
  5. 05キャッシュと本番プレビューの検証

活用シーン

  1. 01Three.jsアプリのデプロイ準備
  2. 02ネストしたベースパスとルート再読み込みのテスト
  3. 03アセット欠落や古いキャッシュの調査

インストール

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

$npx skills add https://github.com/cesartevisual/threejs-skills --skill threejs-deployment

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

詳細

ビルドとデリバリー

プロジェクトにインストール済みのバージョンと既存のアーキテクチャを使用します。以下の指示はユーザーのタスクを補足するものであり、無関係な変更や外部操作を許可するものではありません。

既存のビルドツール、ホスティング先、ベースパス、ブラウザー要件、デプロイの許可を確認します。プロジェクトの規約を維持してください。公開に後からの許可が必要な場合でも、ビルドを準備して検証してください。

Three.js とアドオンのリビジョンに互換性を持たせ、競合するインスタンスを重複排除します。アップグレード前にピア依存関係を確認してください。必要なローダーやヘルパーのみを含め、有用な場合は重いオプション機能のパスを遅延読み込みします。ツリーシェイキングによって未使用のコードが削除されたと想定せず、出力を確認してください。

モデル、テクスチャ、デコーダー、ワーカー、WASM の URL は、ビルドに対応したパスを通じて解決します。実際のネストされたベースパスと、アプリケーションのルートへの直接アクセスをテストしてください。適切な MIME タイプで配信し、アセットへのレスポンスが HTML のフォールバックではないことを確認してください。

正当なクロスオリジンアセットに対して CORS を設定し、選択したワーカー/デコーダー構成に必要な CSP ディレクティブを設定します。必要な機能ではセキュアコンテキストを必須にしてください。実際にスレッド/ランタイム機能で必要な場合に限り、クロスオリジン分離を追加し、サードパーティーリソースへの影響を考慮してください。

コンテンツハッシュ付きアセットには不変キャッシュを使用し、HTML とマニフェストの一貫した更新戦略を採用します。古いサービスワーカーによって、新しいコードと古いデコーダーが組み合わされることを避けてください。製品要件に応じてオフライン状態やエラー状態に対処します。

本番プレビューを実行し、代表的なアセット、キャッシュの動作、読み込み失敗、代替デバイス、ルートの再読み込みを確認します。既存の許可範囲内でのみ公開し、デプロイ済み URL は検証後に限って報告してください。

API リファレンス

正確なシグネチャとリビジョン固有の動作については、公式ドキュメントを参照してください。ドキュメントを利用できない場合は、インストール済みの型定義/ソースを確認し、残る不確実性を明示してください。

コメント