sharpfives / phaser3-starter

Starter project for developing a web-based game using the Phaser 3 engine, Typescript, Webpack, and node modules.

phaser3-starter

This is a starter project that uses best-practices for developing a web-based game using the Phaser 3 engine (via node module), Typescript, and Webpack. The project is configured specifically for #LOWREZJAM with crisp pixel art and a gorgeous resolution of 64 x 64 pixels. Check it out a demo of this project in action here.

Project Structure

All code goes in src/, all resources (images, music, etc.) go in resources/.

The game entry point is in src/main-game.ts. This will start an example scene src/test-scene.ts, which moves a cursor sprite with your mouse.

Install Dependencies

This project uses Webpack and NodeJS to run a minimal webserver for hosting the game. First download and install NodeJS (https://nodejs.org). Then,

cd phaser3-starter
npm i

Run / Debug

npm run dev

This will open a browser window and launch the game. You can now edit any of your files in src/ or resources/ and the game will automatically get rebuilt and the browser page will refresh. Pretty cool! You can debug and set break points in the Typescript source using the Developer Tab window in Chrome.

Production

When you're ready to publish your game, run:

npm run prod

This will condense the game (code and resources) and all its dependencies into a dist folder in the project root. The dist/ folder can now but uploaded to itch.io for everyone to enjoy. See here for instructions on how to use butler for pushing builds (or you can always use the web interface).