Simple Tutorials | Clean Reusable Code Snippets
Rather watch a tutorial?
Purpose of this tutorial
This tutorial will show you how to create a new Angular project and add a Phaser scene to an Angular component in the simplest approach possible. Our newly created scene will consist of a text label displaying “Hello from scene!” and an image of a house.
- click here to download this complete project https://gitlab.com/medinadev.com.tutorials/angular-phaser-tiled-isometric/-/archive/master/angular-phaser-tiled-isometric-master.zip
- You can also find this project on GitLab here: https://gitlab.com/medinadev.com.tutorials/angular-phaser-tiled-isometric
What do you need to get started?
- Download and install Node.js: https://nodejs.org/en/download/
- install angular CLI from command line like so:
npm install -g @angular/cli
Step 1 – Create a new Angular project called “angular-phaser-tiled-isometric” via command line
ng new angular-phaser-tiled-isometric
- Press enter to enable angular-routing
- Press enter to use CSS
It ill take a little bit of time to install the dependencies..
Step 2 – Install Phaser
npm i phaser
Step 3 – Modify our project tsconfig.json to work with Phaser
in tsconfig.json -> change “module” to “AMD”, add “scripthost” to “lib” :