diff --git "a/docs/ENV_01_\347\222\260\345\242\203\346\247\213\347\257\211\343\203\273\346\212\200\350\241\223\343\202\271\343\202\277\343\203\203\343\202\257.txt" "b/docs/ENV_01_\347\222\260\345\242\203\346\247\213\347\257\211\343\203\273\346\212\200\350\241\223\343\202\271\343\202\277\343\203\203\343\202\257.txt" index 9920b53..eda4c22 100644 --- "a/docs/ENV_01_\347\222\260\345\242\203\346\247\213\347\257\211\343\203\273\346\212\200\350\241\223\343\202\271\343\202\277\343\203\203\343\202\257.txt" +++ "b/docs/ENV_01_\347\222\260\345\242\203\346\247\213\347\257\211\343\203\273\346\212\200\350\241\223\343\202\271\343\202\277\343\203\203\343\202\257.txt" @@ -49,6 +49,7 @@ └── packages/ └── shared/ # 共通ロジック (Shared Library) ├── src/ + │ ├── index.ts # エントリーポイント (必須: tsupのビルド対象) │ ├── constants.ts # 定数 (マップサイズ,速度,FPS) │ ├── types.ts # 型定義 (パケット構造,ステート) │ ├── physics.ts # 物理・移動判定ロジック diff --git "a/docs/ENV_02_\347\222\260\345\242\203\346\247\213\347\257\211\346\211\213\351\240\206\346\233\270.txt" "b/docs/ENV_02_\347\222\260\345\242\203\346\247\213\347\257\211\346\211\213\351\240\206\346\233\270.txt" index 48b1b60..e42dba8 100644 --- "a/docs/ENV_02_\347\222\260\345\242\203\346\247\213\347\257\211\346\211\213\351\240\206\346\233\270.txt" +++ "b/docs/ENV_02_\347\222\260\345\242\203\346\247\213\347\257\211\346\211\213\351\240\206\346\233\270.txt" @@ -92,6 +92,15 @@ ・main: "./dist/index.js", types: "./dist/index.d.ts" を指定する. ・scripts: "build": "tsup src/index.ts --format cjs,esm --dts" を追加する. + 3. エントリーポイントの作成 (追加手順) + tsupがビルド対象とするファイルを作成する. + + $ mkdir src + $ touch src/index.ts + + ※ 現時点では空ファイルでよいが,将来的に constants.ts 等を export する記述を行う. + (例: export * from './constants';) + 3-2. フロントエンド (apps/client) Vite プロジェクトとして初期化を行う. @@ -122,6 +131,19 @@ $ pnpm add ws $ pnpm add -D tsx typescript @types/node @types/ws $ pnpm add @repo/shared --workspace + + 3. サーバー用ディレクトリとファイルの作成 + tsxが実行対象とするエントリーポイントを作成する. + $ mkdir src + $ touch src/index.ts + + 4. 実行スクリプトの定義 + package.json にサーバー起動用のコマンドを追加する. + ・編集ファイル: apps/server/package.json + ・内容: + "scripts": { + "dev": "tsx watch src/index.ts" + } 4. 開発ツール設定 (Dev Tools Setup) @@ -163,10 +185,38 @@ ※ shared のビルドが成功することを確認する. 5-2. 開発サーバー起動 - それぞれのディレクトリで開発サーバーが起動することを確認する. + モノレポ構成のため,個別のディレクトリに移動せず,プロジェクトルートから + --filter オプションを使用して各アプリを起動する. + ※ ターミナルを2つ開き,両方を同時に起動した状態で開発を進めることを推奨. - ・Client: - $ pnpm --filter client dev + 1.Client (フロントエンド) の動作確認 + ・ルートディレクトリにて以下のコマンドを実行する. + $ pnpm --filter client dev + + ・ブラウザでの確認: + ターミナルに「➜ Local: http://localhost:5173/」と表示されたら, + Google Chrome等のブラウザを開き,アドレスバーに上記URLを貼り付けて実行する. + + ・正常動作の判断基準: + 画面に「Vite + Preact」のロゴと「Vite + Preact + TypeScript」といった + テキストが表示されていれば,フロントエンドの環境構築は成功である. - ・Server: - $ pnpm --filter server dev (package.json にスクリプト設定後) \ No newline at end of file + 2. Server (バックエンド) の動作確認 + ・テスト用コードの作成: + 動作確認用のエントリーポイントを作成する. + $ touch apps/server/src/index.ts + + ファイルに以下の内容を記述する. + console.log("Server is running!"); + + ・コマンド: + $ pnpm --filter server dev + + ・正常動作の判断基準: + ターミナルに「Server is running!」と出力されれば構築成功である. + + 3.終了方法 (重要) + ・動作確認を終了し,開発サーバーを停止させる場合は,ターミナル上で + 「Ctrl + C」を押下する. + ・停止後はブラウザでURLにアクセスしても接続不可となるが,再度起動 + コマンドを実行すればいつでも再開可能である. \ No newline at end of file