generator-phaser-ts

👾 Phaser + TypeScript generator

Provides a handy jumpstart for a Phaser project with a TypeScript codebase.

In addition to a ready-to-code scaffolding, you get stuff like:

• A fully-functional Phaser project, complete with TypeScript type definitions
• Automated tasks for compiling, bundling, and deploying
• A demo game to get you going
• A Heroku deployment setup

Requirements

You’ll need Node.js, npm, and Yeoman, but you already knew that, yeah?

Installation

$ npm install -g generator-phaser-ts

That’s it.

Usage

$ yo phaser-ts

This gets a project scaffolded out, installs software requirements, and does an initial build of the included demo game.

PRO TIP: Create a new directory for your game and cd to it before running the generator.

Development

This project uses gulp to automate various common development tasks. While you can interact with gulp directly, the generator gives you access to some scripts that should cover your day-to-day needs.:

• gulp lint: Processes all .ts files in the src directory with tslint and displays the results
• gulp build: Compiles all .ts files in the src directory; outputs .js files to the build directory
• gulp bundle: Concatenates all .js files in the build and lib directories into a single file: public/js/bundle.js
• gulp compress: Uglifies the bundled .js file; outputs public/js/bundle.min.js
• gulp watch: Watches for changes to source files; when a change is detected, rebuilds files and reloads the website.
• gulp deploy: Deploys to Heroku. See below.
• gulp: The default gulp task. Runs the bundle task.

For convenience, this project includes a basic Node.js application that serves up your game courtesy of the Express framework. To start the Express server, run npm start. You should now be able to see your game running at http://localhost:3000.

If you would like to run the server as well as rebuild your files upon save, i.e. what you’ll be doing most of the time, run npm run devel.

PRO TIP: If you want to run the server but not rebuild files upon save, set the LIVERELOAD environment variable to 0: LIVERELOAD=0 npm run devel.

Deployment

Included is a Heroku-compatible Procfile so—assuming you have the Heroku Command Line Interface installed and you’re logged in—getting your game up on them internets should be as simple as:

$ npm run deploy

PRO TIP: You can npm run production to locally serve your game using minified code.

Contributing

Please note that this an opinionated tool based on my particular preferences. That being said, all pull requests are welcome!

Licenses

This project is ISC © Nicholas Scheurich.
Phaser is MIT © Richard Davey, Photon Storm Ltd.
PC font is CC BY-SA 4.0 from INT10h.org.