jusion Posted August 29, 2014 Share Posted August 29, 2014 I've just published a new Yeoman generator for Phaser which uses Gulp (which isn't anything new), but it also includes browserify/watchify (!!), as well as linting, autoreload, auto-minify, etc: https://github.com/jroblak/generator-phaser-browserify / https://www.npmjs.org/package/generator-phaser-browserify Browserify allows for more modular code like:var Player = function (game, x, y) { Phaser.Sprite.call(this, game, x, y, 'testsprite'); game.add.existing(this);}Player.prototype = Object.create(Phaser.Sprite.prototype);Player.prototype.constructor = Player;/** * Automatically called by World.update */Player.prototype.update = function() {};module.exports = Player;var Player = require('../entities/player');var Game = function () { this.testentity = null;};module.exports = Game;Game.prototype = { create: function () { this.testentity = new Player(this.game, x, y); this.testentity.anchor.setTo(0.5, 0.5); }, update: function () { }, onInputDown: function () { }};with only one script in your index.html:<!-- build:js main.min.js --><script src="/js/main.min.js"></script><!-- /build -->Browserify / Watchify automagically handles all everything else for you. You can install via npm install generator-phaser-browserify then start a new project with yo Phaser-browserify (requires Yeoman to be installed as well -- npm install yeoman) You can submit any errors or issues with it here: https://github.com/jroblak/generator-phaser-browserify/issues Brad P. Taylor 1 Link to comment Share on other sites More sharing options...
crysfel Posted August 29, 2014 Share Posted August 29, 2014 Nice work, thank you for this, this definitely helps newbies like me. Just wondering, what are the differences with this one: https://github.com/codevinsky/generator-phaser-official Regards Link to comment Share on other sites More sharing options...
jusion Posted August 29, 2014 Author Share Posted August 29, 2014 It uses a different build system (Gulp) which I find better and more understandable. It also demonstrates how to use the module-based system via the automatically generated scaffolding a little more effectively. Finally, it doesn't look like the one you posted uses watchify, so I'm not sure if it works with browserify while being served locally with live-reload. I also just pushed a few bug fixes, so it should be 100% good to go! Link to comment Share on other sites More sharing options...
ap13p Posted August 30, 2014 Share Posted August 30, 2014 Thanks for the generator, I like it so much. Now my project more structured. Especially with the combination of gulp, watchify and browserify Link to comment Share on other sites More sharing options...
jusion Posted September 3, 2014 Author Share Posted September 3, 2014 Glad you enjoy it! Link to comment Share on other sites More sharing options...
eguneys Posted September 3, 2014 Share Posted September 3, 2014 Whaat, I am just starting a new Phaser yeoman generator myself. It's going to use gulp and requirejs. Game is on! Link to comment Share on other sites More sharing options...
crysfel Posted September 3, 2014 Share Posted September 3, 2014 It would be nice to add a class system like Ring ( http://ringjs.neoname.eu/), Joose (http://joose.it/) or any other like that. When using prototypes the code looks awful xD Regards Link to comment Share on other sites More sharing options...
bmceldowney Posted September 4, 2014 Share Posted September 4, 2014 Wait, I'm confused. The generator-phaser-official (https://github.com/codevinsky/generator-phaser-official) already uses browserify and a file watcher. Heppell08 1 Link to comment Share on other sites More sharing options...
Heppell08 Posted September 5, 2014 Share Posted September 5, 2014 Yeah I use codevinsky's yeoman generator. Has watchify, server, minify and all the other cool stuff required. Don't see the use for more generators when Codevinsky's already does the job required. Suppose each to their own though. Link to comment Share on other sites More sharing options...
PixelPicoSean Posted September 5, 2014 Share Posted September 5, 2014 The official generator is great but looks like not updated for few months, which I think still lack of features. Yeoman uses Grunt by default which is slower than Gulp, and I prefer BrowserSync to LiveReload because of it does not force a reloading when inject CSS styles which makes it very useful for tweaking UI layout if you're using DOM for HUD.So I made my own generator https://github.com/pixelpicosean/slush-phaser-project/.It has some improvement you may want, it's possible to specify path of a prefab to be generated, and I'm trying to add support for a class system which I think will benefit many people.And more features are in the plan, because there're still many things can do by a generator instead of duplicate or copy/paste every time you want to start a game very quickly. Heppell08 1 Link to comment Share on other sites More sharing options...
eguneys Posted September 6, 2014 Share Posted September 6, 2014 Nice and comprehensive generator, +1 for ES6 modules, PixelPicoSean. However Yeoman doesn't depend on grunt, you can use gulp or anything with yeoman, also connect-livereload module does not force reloading but it also injects CSS styles. Link to comment Share on other sites More sharing options...
bmceldowney Posted September 8, 2014 Share Posted September 8, 2014 The official generator is great but looks like not updated for few months, which I think still lack of features. Yeoman uses Grunt by default which is slower than Gulp, and I prefer BrowserSync to LiveReload because of it does not force a reloading when inject CSS styles which makes it very useful for tweaking UI layout if you're using DOM for HUD.So I made my own generator https://github.com/pixelpicosean/slush-phaser-project/.It has some improvement you may want, it's possible to specify path of a prefab to be generated, and I'm trying to add support for a class system which I think will benefit many people.And more features are in the plan, because there're still many things can do by a generator instead of duplicate or copy/paste every time you want to start a game very quickly.Gotcha. I'm all for tool variety, I just didn't want anyone to get the wrong impression from your original post and think that generator-phaser-official didn't have browserify, a file watcher and auto loading. Link to comment Share on other sites More sharing options...
eguneys Posted September 17, 2014 Share Posted September 17, 2014 I've published my yeoman generator for Phaser using gulp and requirejs. I documented an article about it, make sure to check it out at http://www.eguneys.com/blog/2014/09/17/lets-build-a-yeoman-generator-2/. Link to comment Share on other sites More sharing options...
cjke Posted August 17, 2015 Share Posted August 17, 2015 I just wanted to let you guys know that the generator-phaser-official didn't appear to be working (issue 13).If you are looking for a fix, please see My pull request. I wanted to contribute to an existing one, instead of creating a new one from scratch. Cheers Link to comment Share on other sites More sharing options...
Recommended Posts