rich Posted December 10, 2013 Share Posted December 10, 2013 I've just completed Part 1 of a tutorial on using Phaser with TypeScript. There were a few kicking around from pre 1.0 versions, but this one is bang up to date, with TypeScript 0.9.5 and Phaser 1.1.3. http://www.photonstorm.com/phaser/how-to-use-phaser-with-typescript Part 2 will show how to use the more advanced features of TypeScript with Phaser, like extending classes and state management. eliasku and shawnbless 2 Link to comment Share on other sites More sharing options...
Mike Posted December 10, 2013 Share Posted December 10, 2013 Ahhh knowledge from the source. Thanks Rich. Honestly the only reason to start using typescript was because Phaser used and this was a sign for a good and structured codebase. Now more than half an year later I see that the good codebase is made by the developer, but still TypeScript can save you some headaches and help with code organization. So useful tutorial and Part 2 will be surely needed. Link to comment Share on other sites More sharing options...
rich Posted December 10, 2013 Author Share Posted December 10, 2013 Yup Part 2 coming tomorrow. shawnbless and eliasku 2 Link to comment Share on other sites More sharing options...
Mikeware Posted December 16, 2013 Share Posted December 16, 2013 I started to try and use TypeScript with Phaser for the Ludum Dare competition; however, it wasn't compiling as the Array constructs weren't typed properly. I supposed this is a new restriction with the 0.9.5 TypeScript update from last week? Will you be updating the definition file to type the Arrays soon? Thanks! Link to comment Share on other sites More sharing options...
rich Posted December 16, 2013 Author Share Posted December 16, 2013 The tutorials were written (and compiled) using 0.9.5, but I'll draw your attention to this part at the beginning "Note: At the time of writing the most accurate TypeScript definitions file is here in the dev branch of Phaser (click the “Raw” link to download it). Please use this one for the rest of this tutorial. We’ll remove this notice when it moves from dev to master." Link to comment Share on other sites More sharing options...
Mikeware Posted December 16, 2013 Share Posted December 16, 2013 Thanks! I thought I had pulled the latest copy, but I guess it defaults to the master branch and not the dev branch. I'll try that out. Link to comment Share on other sites More sharing options...
BigRob154 Posted December 16, 2013 Share Posted December 16, 2013 Any recommendations for Editors / IDEs for TypeScript on OS X? Link to comment Share on other sites More sharing options...
pat Posted December 16, 2013 Share Posted December 16, 2013 webstorm is a good ideahttp://www.jetbrains.com/webstorm/download/ Link to comment Share on other sites More sharing options...
aladine Posted December 18, 2013 Share Posted December 18, 2013 Now this is getting VERY interesting, i think it's time for me to clean that big JavaScript mess i did last week lol Thanx a lot Rich!! Link to comment Share on other sites More sharing options...
JHardin1112 Posted January 22, 2014 Share Posted January 22, 2014 So I'm following along with the tutorial - http://www.photonstorm.com/phaser/how-to-use-phaser-with-typescript. I got to Step 5 'Test you game' and the image displays correctly as shown below. I am concerned because at this point I am getting 10 build errors in Visual Studio 2013. The errors are all the same and state, "The property 'game' does not exist on value of type 'SimpleGame'. It's obviously working as I'm seeing the image in my browser. But why does it not recognize game? I made sure I have the latest TypeScript definitions from the dev branch. It's more a matter of convenience because I'm unable to use code completion for anything following 'game'. I just realized after I posted this that my code completion is not working as expected. In Step 6, it tells me to type in 'logo.' and I should get a pop-up with all the properties of a Phaser.Sprite object but no pop-up appears. I'm assuming this is directly related to my errors. Any ideas? Link to comment Share on other sites More sharing options...
JHardin1112 Posted January 28, 2014 Share Posted January 28, 2014 Just wanted to see if anyone had any ideas regarding the issue in the previous post I submitted last week? I like using Visual Studio 2013 to develop, but this issue with the Intellisense is bothersome. I'm sure I'm missing something glaringly obvious, and hope someone (Rich =D) can advise me. Link to comment Share on other sites More sharing options...
rich Posted January 28, 2014 Author Share Posted January 28, 2014 Have you tried adding a <reference> to the phaser.d.ts file at the top of your TS files? Link to comment Share on other sites More sharing options...
JHardin1112 Posted January 28, 2014 Share Posted January 28, 2014 Have you tried adding a <reference> to the phaser.d.ts file at the top of your TS files?Rich, no I have not. Honestly, I'm unsure of how to do this (correct syntax and all.) Would you be able to post the line of code that adds the reference? I'm used to adding references in vb and c# (imports and using), just never worked with TypeScript before. Link to comment Share on other sites More sharing options...
JHardin1112 Posted January 28, 2014 Share Posted January 28, 2014 I thought this was correct - <reference path ="phaser.d.ts" / >, but VS does not like this line of code.NVM - A little bit more research and I found the answer - /// <reference path="phaser.d.ts"/> Damnit....spoke too soon. Still NOT working. Link to comment Share on other sites More sharing options...
JHardin1112 Posted January 28, 2014 Share Posted January 28, 2014 Rich, Once I add the 3 files to my project (phaser.js, phaser.d.ts, phaser.min.js) I'm supposed to grab the latest TS definitions using RAW view from the following link https://raw2.github.com/photonstorm/phaser/dev/build/phaser.d.ts, correct? I went to RAW, selected all content and copy pasted it into my projects phaser.d.ts file. Was this correct? Here is a screen grab of my curren situation. Does anything obvious stand out to you? Thanks in advance. I know you're getting over being sick, so I appreciate your help. Link to comment Share on other sites More sharing options...
rich Posted January 28, 2014 Author Share Posted January 28, 2014 You're missing this line from the code:game: Phaser.Game;Should go after the constructor (before the preload function) Link to comment Share on other sites More sharing options...
JHardin1112 Posted January 28, 2014 Share Posted January 28, 2014 You're missing this line from the code:game: Phaser.Game;Should go after the constructor (before the preload function) Oh man, thank you Rich! It worked (of course it did!) I'm kicking myself for missing something so obvious. It really helps to have a second set of eyes in these moments. Thanks again! Link to comment Share on other sites More sharing options...
Recommended Posts