Jump to content

Phaser and RequireJS - Is it still working?


Recommended Posts

Was following a guide on using RequireJS with Phaser and my main.js starts like this:

require(['lib/phaser.min','module/Player'],function(Phaser,Player){    var game = new Phaser.Game(1067, 600, Phaser.AUTO, '', { preload: preload, create: create, update: update, render: render }, false, false);

And right away the console gives me the error "Uncaught TypeError: Cannot read property 'Game' of undefined"

But if I try it with an older version of Phaser (the one provided with said guide, don't know how to check the version) it gets past that line.

So are the new versions of Phaser incompatible with RequireJS or do I need to do something else?

Link to comment
Share on other sites

I got the same error.

My solution is to not give Phaser a name, when loading it.

require(['module/Player','lib/phaser.min'],function(Player){  var game = new Phaser.Game(etc..);});

This makes Phaser globally accessible, so you can use Phaser in modules without passing it to them. 

Link to comment
Share on other sites

Only Phaser is global, so it's not a huge problem and sometimes it comes handy that i don't have to pass Phaser around.

I don't even know if it's a good way to require phaser this way. I found this solution by chance and I couldn't find anything about it in the Require.js docs.


My guide is pretty old now that Phaser 2.0.0 came out, but you can find here: http://www.html5gamedevs.com/topic/4437-how-to-organize-your-phaser-game-even-better/?hl=organize


I remade the Invaders example using require.js with Phaser 2.0.2(No Physics). The best thing about the game is that it uses states.

You can find it here: https://github.com/StrykerKKD/SpaceInvaders

Link to comment
Share on other sites

The problem here is that Phaser is now a named module giving it the id "Phaser".  I've got a bit of an OCD tick that requires me to use only lowercase in my require statements and have all third party libraries ID'ed by only their name.


To do this, just add this to your confg:

requirejs.config({	paths: {		Phaser: 'path/to/phaser'	},	map: {		'*': {			phaser: 'Phaser'		}	}});

Now, you can just pull in phaser like this:

define(function(require) {	"use strict";	var Phaser = require('phaser');	.	..	...});

Now that's much more clean.


I should also note that using the alternative commonjs-ish syntax will make your life a whole hell of a lot easier.  In fact, I did a small post on this a little bit ago.

Link to comment
Share on other sites


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...