Vue Phaser Start Template
Starter Template: Phaser + Vue + Pinia + Vite for HTML5 GamesThis is a starter template for creating HTML5 games.
This is a starter template for creating HTML5 games. Optimized for PC and platforms like itch.io. Supports fullscreen mode.
Tech Stack:
- Phaser – used for game logic and graphics rendering
- Vue – used for building user interfaces
- Pinia – used for managing game state
- Vite – used for project bundling and development
Authors:
Art is sourced from open resources.
Character design and animation by Pavel Bezdornov.
Built-in Game Mechanics:
- Top-down movement (WASD)
- Platformer movement (WAD)
- Level transitions powered by Vue Router
- Health gain and loss system
Installation and Build:
- Requires Node.js version 20+
- Install dependencies:
npm i
- Start development server:
npm run dev
- Build the project:
npm run build
- Serve the built project:
npm serve dist
(This allows running the template on a regular hosting or platforms like itch.io)
Project Structure:
composition
– contains files for game logic using the Phaser engineconfigs
– contains constants for engine settings, game logic, and event namesscenes
– contains files for managing Phaser scenes (Phaser.Scene
)screens
– contains Vue components responsible for rendering game screensstore
– contains files for working with Piniaui-components
– contains Vue components for rendering the HUDutils
– contains helper functionspublic/assets
– contains all assets
Leave a comment
Log in with itch.io to leave a comment.