Jump to content

Best Typescript/Phaser IDE?

Recommended Posts

A couple years ago a built an Asteroids clone using JS and Phaser on Cloud9 (c9.io). Was a great experience and a great way to learn JS. I'm now looking at a second game that I'd like to code with Typescript and distribute on the Android platform and possibly iOS. C9 has since been bought by Amazon and not supporting the C9 IDE as much. Regardless, it never supported breakpoints for JS, so had to debug using the Chome dev tools. 

My day job is coding C++ on visual studio. What's the best IDE for coding Typescript for Phaser? Ideally (for me) it would be close to Visual Studio experience (e.g., eclipse) but I'm up for something different. Mostly, I'd like to get away from the clunky C9 / Chome debugging.

Link to post
Share on other sites

Currently Visual Studio Code is the best IDE for TypeScript by far (it's made by Microsoft, so is Typescript so it comes with default Typescript support). This is a no brainer, go with VSCode and you won't regret it.

Get it here: https://code.visualstudio.com/

Link to post
Share on other sites

Visual Studio Code looks awesome!! I'm going to take the plunge. For me, the least-fun part always is setting up the dev environment. I found a few links for setting up an environment with VSCode, Typescript, and Phaser:




If you have any other advice to help me up the learning curve I'm all ears.


Link to post
Share on other sites

thats right if you use intellisense you should get authomatically the intellisense for phaser directly from the phaser typescript definitions. That is not the case if you use a javascript unfortunatly. So my extension is mainly for those people(me included).


PS: I am talking about intellsense of phaser not of typescript.( phaser method definitions, autocomplete, tooltips, etc).


And yes there are tons of extension for vscode and you should use them.

I recommend chrome debugger for vscode, html css formatter, vs icons, one dark pro theme.

I have a million others but they re not related to game development( angular and react snippets, python support, node run, etc)

Link to post
Share on other sites

Visual Studio is the best to code in Typescript right now.

To work with Phaser you have to fight for a while (at lest with Visual Studio community 2017)... but after the fight you can code without any problem and you will have Intellisense (if you remind yourself to declare the type of anything).

Link to post
Share on other sites

+1 for VSCode ! Light, fully integrated with browsers for debugging, and best support for TypeScript. You can probably get a similar "developer experience" using Atom or Sublime ; personal preference might justify fiddling a little bit. I find bigger IDEs like Visual Studio Community (which I love for other projects, including C++ and .Net) are overkill and counter-productive for script-based games.

Link to post
Share on other sites

It's so amazing how tied to their editors people get! All of the HTML powered editors use the same typescript modules underneath, they are all identical for TS support! Anyone that says 'VSCode is the best for TS' hasn't got a clue, its no better nor worse than any of the others as they all use the same modules underneath.

I agree with @Refeuh, personal preference should justify fiddling a bit, they'll all much of a muchness. I also stay away from larger IDE's as you don't need what they offer for web development, but, again, this isn't a hard rule, it really is just a personal preference.

For me I wanted an HTML-based editor (VSCode, Atom, Brackets) as I wanted to dig in to it, I stuck with Atom because I contributed code to it and will only move when it becomes prohibitively slow to use. VSCode is very popular amongst the devs I work with (10-12 teams, so 50-60 devs).

Spend an hour with each and see which one you like, your criteria might be plugins/modules they support (they ALL do the same stuff, like TS integration), might be theme availability (bare in mind you're a web dev and they're web tech so you can change things easily), might be some rare feature that only one of them supports. Get a feel for the community, this is mega important, as you'll want to make sure it is regularly updated, new features added where necessary and that all the plugins you rely on are well supported. Atom and VSCode are particularly well supported, you could even go so far as to say VSCode (which is newer) has really shaken things up again and started a mini editor war, which is awesome for all of us as users.

Link to post
Share on other sites
  • 3 weeks later...

I setup Visual Studio Code to have just 1 keypress from editing to testing game, so I do:

F5 -> runs some of my batch files, runs typescript compiler, opens new chrome window with game. (You'd need some familiarity how Visual Studio code tasks work and have the chrome remote debugger plugin.)
Ctrl+W (in Chrome) -> closes chrome and focus is back on visual studio code.

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Create New...