Jump to content

Setup and build of projects, Phaser's folder structure and debugging


plicatibu
 Share

Recommended Posts

Hi.

 

I started reading all post in this forum from the oldest to the newest in order to understand Phaser a little better and to see if I find out some of my own doubts already asked / answered.

 

Notwithstanding I have some very basic doubts about how to configure my development environment (I think that mainly because I'm still learning JavaScript).

 

Currently I'm creating a folder with the following structure (It's based in the post Is there a tutorial on a basic setup for Phaser?):

mygame/+       +-img/       +-lib/       |    +-phaser-min.js       +-snd/       +-src/       |    +-game.js       |    +-file1.js       |    +-file2.js       +-index.html

Where file1.js, file2.js, and so on are files called by game.js

 

My next step would be to generate an output folder ( say, named build ) that would contain all JavaScript merged into a single file as well as minified. Something like the following:

mygame/+       +-img/       +-lib/       | +-phaser-min.js       +-snd/       +-src/       | +-game.js       | +-file1.js       | +-file2.js       +-index.html       |       +-build/              +-img/              +-snd/              +-game.js              +-index.html

The point is I don't have any clue how to do it. Is there any script / tool available for that? Preferably command line tools that I can call from shell scripts / bat files or directly from VIM.

 

Another point I'd like to understand is the folder structure of Phaser.

 

I imagine that for develop a game I just need to use either phaser.js or phaser.min.js file and that the remaining files are either for development of Phaser itself or example files to guide us. Right?

 

What's better to use during game development: either phaser.js or phaser.min.js file?

 

 

Regarding the index.html file, in examples, usually I see JavaScript embedded in it:

<script type="text/javascript">(function () {...})();</script>

Can't I just create a function (say run()) and call it:

<script type="text/javascript">run();</script>

Is there any implication in doing this? Any special care I should take?

 

If someone could point me how to debug the my code it would be nice.

 

Any other tips you judge useful are very much appreciated.

 

 

 

Thank you all.

Link to comment
Share on other sites

 

I imagine that for develop a game I just need to use either phaser.js or phaser.min.js file and that the remaining files are either for development of Phaser itself or example files to guide us. Right?

 

What's better to use during game development: either phaser.js or phaser.min.js file?

Yup, you just need to include either phaser or phaser.min. You should use phaser.js during development (for easier debugging) and switch to phaser.min.js when you're ready to deploy your game.

 

 

 

Regarding the index.html file, in examples, usually I see JavaScript embedded in it

 

In my index.html, I usually have something like this:

<!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head>    <meta charset="utf-8" />    <meta name="viewport" content="initial-scale=1 maximum-scale=1 user-scalable=0" />    <title>Game</title>    <script src="phaser.min.js"></script>    <script src="game.js"></script></head><body>    <script type="text/javascript">        window.onload = function () {            var myGame = new Phaser.Game(1024, 672, Phaser.AUTO, 'game');            myGame.state.add('boot', Screen.Boot, true);            myGame.state.add('preloader', Screen.Preloader);            myGame.state.add('gamescreen', Screen.GameScreen);        }    </script>    <div id="game"></div></body></html>

 

 

If someone could point me how to debug the my code it would be nice.

Google Chrome has some very nice debugging tools: https://developers.google.com/chrome-developer-tools/docs/javascript-debugging

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

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