rpgjs

RPGJS v5 プロジェクト

概要

このスキルを使用して、ライブドキュメントを信頼できる情報源として、RPGJS v5 プロジェクトで作業します。変更を加える前に、まず現在のコードベースがRPGJSプロジェクトであることを確認し、curl または同等のCLI取得ツールで、関連するRPGJSおよびCanvasEngineのドキュメントを読み込みます。

まずはこちら

何よりも先に、現在のワークスペースが実際のRPGJSプロジェクトであることを確認します。

1つ以上の package.json ファイルを調べ、@rpgjs パッケージを探します。

便利なコマンド：

rg -n '"@rpgjs|@rpgjs/' . --glob 'package.json'
rg --files . | rg 'package.json$'

プロジェクト内の package.json のいずれにも @rpgjs/* が使われていない場合、記憶を頼りにプロジェクト構造を手作業で組み立てないでください。

まずRPGJS v5のクイックスタートを読み、その後、ドキュメントに記載された手順でプロジェクトをインストールします。

プロジェクトが存在しない場合のセットアップでは、クイックスタートを必ず先に確認してください。

新規インストールにはTiledマップエディターとの連携とサンプルマップがすでに含まれているため、プロジェクトを手作業で組み立てるのではなく、そのひな形をベースラインとして使用します。

次のURLを使用します。

https://v5.rpgjs.dev/guide/quick-start.md

ライブドキュメントを読み込む

RPGJS v5の使用方法について、記憶に頼らないでください。コードのインストールや変更を行う前に、curl または同様のCLIツールでドキュメントを取得し、関連ページを読みます。

RPGJSドキュメントのインデックスを取得します。

curl -fsSL https://v5.rpgjs.dev/llms.txt

目次として llms.txt ファイルを使用します。そこから関連するMarkdownリンクを抽出し、必要なページを取得します。

ワークフローの例：

curl -fsSL https://v5.rpgjs.dev/llms.txt -o /tmp/rpgjs-v5-llms.txt
rg -o 'https://[^ )]+\\.md' /tmp/rpgjs-v5-llms.txt
curl -fsSL https://v5.rpgjs.dev/guide/quick-start.md

llms.txt が相対リンクを使用している場合は、https://v5.rpgjs.dev/ を基準に解決します。

タスクに必要なページのみを読むことを優先します。取得するドキュメントは、必要な範囲に絞ってください。

.ce ファイルに関するCanvasEngineのルール

すべての .ce ファイルをCanvasEngineのコードとして扱います。

.ce ファイルを編集、作成、または説明する前に、CanvasEngineドキュメントのインデックスを取得します。

curl -fsSL https://canvasengine.net/llms.txt

次に、そこから参照されている関連Markdownページを取得します。ドキュメントを直接読める場合、記憶を頼りにCanvasEngineの構文を作り出さないでください。

タスクがメニュー、HUD、オーバーレイ、ダイアログ、タイトル画面、または .ce で終わるファイルに関係する場合は、まずCanvasEngineのドキュメントを読み込み、その後、近くにあるプロジェクトコンポーネントを調べてローカルの規約を確認します。

GUIのCSSに関するルール

GUIのスタイル設定には、関連のないCSSシステムを独自に作るのではなく、RPGJS UI CSSライブラリを使用します。

GUIのスタイル、クラス、またはレイアウトルールを変更する前に、次のドキュメントを取得して読みます。

curl -fsSL https://raw.githubusercontent.com/RSamaium/RPG-JS/refs/heads/v5/packages/ui-css/README.md

タスクがGUIの外観、メニュー、HUD、ダイアログボックス、通知、ショップ、またはタイトル画面に影響する場合：

• プロジェクト内で既存のRPGJS UI CSSの使用箇所を調べます
• UI CSSのREADMEに照らして、利用可能なクラス、構造、スタイル設定のパターンを確認します
• 独自の場当たり的なCSSより、ライブラリの規約を拡張する方法を優先します

物理演算に関するルール

RPGJSでは、衝突や関連する動作に、RPG向けの専用物理演算エンジンを使用します。

衝突、移動制限、当たり判定、マップの通行制限、または物理演算に関係するその他のゲームプレイ動作を変更する前に、次のドキュメントを取得して読みます。

curl -fsSL https://raw.githubusercontent.com/RSamaium/RPG-JS/refs/heads/v5/packages/physic/README.md

一般的なゲームエンジンの慣習から衝突の動作を推測しないでください。まず物理演算ライブラリのドキュメントで確認します。

同期に関するルール

状態を表すデータは、同期対象のプレイヤープロパティを通じてクライアントとサーバー間で同期する必要があります。

同期状態、複製されるプレイヤーデータ、スナップショットの動作、またはマップをまたぐ永続化を変更する前に、次のガイドを取得して読みます。

curl -fsSL https://v5.rpgjs.dev/guide/synchronization.md

同期、スナップショット、サーバー再起動、またはマップ転送後も保持する必要がある永続状態には、プレイヤーの props を使用します。

props が適切なモデルである場合、永続的なゲームプレイ状態に、その場しのぎの別経路を使用しないでください。

保存状態にせず、現在のマップ上でブロードキャストする一時的なメッセージには、map.broadcast(type, data) を使用します。

その通信方式が実際に必要な場合は、クライアントから送信されたソケットデータを監視するために player.on(key, cb) を使用します。

作業手順

次の順序で進めてください。

1. package.json で @rpgjs/* を確認し、現在のワークスペースが RPGJS プロジェクトであることを確認します。
2. そうでない場合は、https://v5.rpgjs.dev/guide/quick-start.md を取得して読みます。
3. ドキュメントに記載されたクイックスタートの手順に従って、プロジェクトをインストールします。
4. スキャフォールドに @rpgjs/* パッケージが含まれていることを確認します。
5. curl または同等の方法で https://v5.rpgjs.dev/llms.txt を取得します。
6. タスクに必要な RPGJS の Markdown ページを取得します。
7. .ce ファイルが関係する場合は、https://canvasengine.net/llms.txt と、関連する CanvasEngine の Markdown ページも取得します。
8. GUI のスタイル設定が関係する場合は、RPGJS UI CSS の README を取得し、CSS のリファレンスとして使用します。
9. 衝突判定や物理演算が関係する場合は、RPGJS physic の README を取得し、物理演算のリファレンスとして使用します。
10. 同期状態またはネットワーク上のプレイヤーデータが関係する場合は、同期ガイドを取得し、デフォルトの状態モデルとして props を使用します。
11. 編集前に、ローカルのコードベースで規約を確認します。
12. 変更を実装し、プロジェクトで通常使用するコマンドで検証します。

インストール規則

RPGJS プロジェクトがまだ存在しない場合：

1. curl または同等の方法でクイックスタートページを読みます。
2. パッケージ名やフォルダー構成を推測せず、ドキュメントに記載されたインストール手順に従います。
3. ユーザーから削除または置き換えるよう明示的に指示されない限り、生成された Tiled 連携とサンプルマップはそのまま残します。
4. スキャフォールドが作成され、プロジェクトが RPGJS のコードベースとして認識されてから、機能の作業を開始します。

インストールにネットワークアクセスまたはサンドボックス外へのパッケージマネージャーによる書き込みが必要な場合は、承認を求め、助言だけで止めずにインストールを進めます。

プロジェクトの手がかり

RPGJS v5 プロジェクトでは、次のような要素がいくつか見られます。

• package.json 内の @rpgjs/* 依存関係
• client.ts、server.ts、場合によっては standalone.ts のエントリーポイント
• config.client.* と config.server.* の設定ファイル
• サーバー／クライアント／共通の分割構成
• Tiled に関連付けられたマップまたはワールドのコンテンツ
• ゲームプレイ用クラス、イベント定義、マップロジック
• .ce ファイルで記述された UI コンポーネント

ドキュメントを確認した後は、既存のプロジェクト構成を主要な規約の参照元として扱ってください。

編集ガイドライン

新しいゲームプレイオブジェクト、マップロジック、UI コンポーネントを作成する前に、最も近い既存ファイルを確認してください。

ゲームプレイやエンジンとの統合に取り組む場合：

• 取得した RPGJS ドキュメントと照らし合わせて、インポートと API を確認してください
• 汎用的な抽象化よりも、近くにあるプロジェクトのパターンに合わせてください
• サーバーとクライアントの責務が現在のコードベースと一致するようにしてください
• マップが provideTiledMap またはカスタムの provideLoadMap を通じて読み込まれているか確認してください

packages/studio 内の RPGJS Studio ランタイムに取り組む場合：

• 対応するランタイムブロックスキーマ、型、エグゼキューター、レジストリーのエクスポート、skills/rpgjs-studio の参照をまとめて更新してください
• ゲームエンジン内でブロックが実行される場合は、packages/studio/tests に Vitest のテストを追加または更新してください
• 再利用可能な Studio イベントには commonEventId を使用してください。call_common_event は選択したイベントのワークフローを実行し、spawn_common_event は表示されるランタイムオブジェクトを map.createDynamicEvent(...) に委譲します
• ブロックエグゼキューターがゲームプレイ中に追加の Studio API 呼び出しを行わずに共通イベントデータを解決できるよう、RPGJS マップのランタイムコンテキストに共通イベントデータを保持してください

.ce コンポーネントに取り組む場合：

• 取得したドキュメントと照らし合わせて、CanvasEngine の構文を確認してください
• 隣接する .ce ファイルを調べ、確立されたパターンを確認してください
• ユーザーがより広範なリファクタリングを求めていない限り、既存のコンポーネントスタイルを維持してください

GUI スタイルに取り組む場合：

• RPGJS UI CSS ライブラリーを標準のスタイリングシステムとして使用してください
• UI CSS README と照らし合わせて、クラス名と構造を確認してください
• ユーザーが明示的に求めていない限り、ライブラリーの規約を独自の CSS に置き換えないでください

衝突や移動ルールに取り組む場合：

• RPGJS physic README と照らし合わせて、前提を確認してください
• 衝突の挙動を判断する際は、専用の物理エンジンを信頼できる情報源として扱ってください
• ライブラリーがサポートしていない汎用的な物理パターンをインポートしないでください

同期状態に取り組む場合：

• マップ、スナップショット、再起動をまたいで維持する必要がある状態には、プレイヤーの props を使用してください
• ドキュメントに記載されたオプションに従って、同期と永続性を意図的に設定してください
• 一時的で永続化しないマップ全体へのメッセージには map.broadcast(...) を使用してください
• player.on(...) は、クライアントからサーバーへの明示的なソケット通信にのみ使用してください
• 同期プロパティで解決できる場合は、永続的なゲームプレイ状態を独自のパスに保存しないでください

参考資料

標準のドキュメント URL、最小限の取得手順、プロジェクトが存在しない場合のブートストラップ規則が必要な場合は、source-map.md をお読みください。 このリポジトリーで使用されている RPGJS v5 の基本的なプロジェクトモデルが必要な場合は、architecture-notes.md をお読みください。