Phaser generator for Yeoman

[ladybenko]

Hi all,

 

I created a Phaser generator for Yeoman (a scaffolding tool). The original idea was to have an easy way to set up a HTML 5 game project for game jams, prototypes, etc. It doesn't have a lot of features, but it provides:

• Latest version of Phaser, of course
• A starter project with an asset preloader scene, plus a main scene.
• A gulpfile with some basic tasks:
  • Launch a local web server
  • Livereload (so the web browser does a reload automatically when a JS file changes)
  • Deployment via rsync
• Browserify integration, so you have a nice way to create modules for your game (and/our use NPM packages)  or import other files while we wait for ES6 to be common.
• Two HTML files: one that acts as a viewer/wrapper (which you can customize) and another one that is just a canvas so the game can be embedded in 3rd party sites (like itch.io or Ludum Dare)

If you have node and NPM in your system, this is really easy to setup. First you need to install Yeoman and this generator:

npm install -g yo generator-gamejam

Then you create a new directory for your game (or clone an empty git repository) and run Yeoman from there:

mkdir my-fancy-gamecd my-fancy-gameyo gamejam

You will be asked several questions, such as the title of your game, the license you want to use, the resolution you'd like, etc. With this info, you will get a custom base template you can build your game on

 

Once the template is set up, you can try it by running:

gulp run

Then open your browser in http://localhost:8080 and boom!

 

 

If you want livereload, you'll need an extension for your browser, like this one for Chrome. 

 

There's a gulp task to deploy your game to a server via rsync. In order for that to work, you need to edit the file gulp.config.json with the data of your server.

 

And I think that's it. If you have any comments, or feature requests, they are more than welcome.

 

Happy coding

[boolean]

Wow this deserves a thread bump! This is great

 

I'm loving this setup. I've been using http://www.codevinsky.com/phaser-tutorial-getting-started-with-generator-phaser-official/ up until now. It's great for larger projects, but I find for game jams its a bit more than I need. I ended up hacking it down to a lighter package, but it still has a lot of things I don't need. This package is basically what I tried to make, but cleaner! 

 

I really like how it has all the boot and preload stuff in one main.js file, so then PlayScene.js is your go-to coding area. For game jams I really like just being able to work in a single file, but I hate cluttering it up with all my asset loading and boot config junk at the top. So I like how you have all your pre-load stuff in one file (rather than splitting them out to boot.js + preload.js + main.js).

 

Great work!

[ladybenko]

Great work!

 

Thanks! I'm glad you can find it of use If you have any suggestions about something that is missing, or that you think it should be removed, please let me know.

[diegoalmesp]

Thanks man!! I was looking for something like this, the initial setup is great and clean. Good job!