- Framework: Vue 3
- Language: TypeScript
- Package Manager: pnpm
- Build Tool: Vite
- Linter: ESLint, Stylelint
- Styling: Tailwind CSS v4
- pnpm がインストールされている必要があります。
frontend/ディレクトリ内で、pnpm installコマンドを実行して依存関係をインストールしてください。
- プロジェクトルートで
make frontend/devを実行することで、開発サーバーを起動できます。- ブラウザで http://localhost:5173 にアクセスして、ゲームが動作していることを確認してください。
- コードを編集すると、ブラウザが自動的に更新されて変更が反映されます。
package.jsonを書き換えたり Git 操作によってpackage.jsonが変更された場合は、make frontend/installを実行して依存関係を更新する必要があります。- その他のコマンドについては、
make helpを参照してください。
- Vue を書く際は、常に Composition API を使用し、Options API は使用しないでください。
- 基本的に CSS は直接書かず、Tailwind CSS のユーティリティクラスを使用してスタイリングしてください。
- ただし、アニメーションの定義など、ユーティリティクラスだけでは実現が難しいスタイリングについては、Scoped CSS を使用してスタイリングしてください。