Angular and Phaser

Neil Haddley • May 10, 2023

Using Phaser in an Angular Component

AngularTypeScriptangularphasergame-devtypescript
← Back to Posts

Highlights

BASH
1% npm i -g @angular/cli
2% ng new haddley-angular-phaser
3% cd haddley-angular-phaser
4% npm i phaser
5% code .
6% ng generate component bounce

I updated angular.json:

JSON
1"scripts": ["node_modules/phaser/dist/phaser.min.js"]
I ran ng new haddley-angular-phaser

I ran ng new haddley-angular-phaser

I installed phaser with npm

I installed phaser with npm

I generated the bounce component

I generated the bounce component

I updated angular.json with "scripts": ["node_modules/phaser/dist/phaser.min.js"]

I updated angular.json with "scripts": ["node_modules/phaser/dist/phaser.min.js"]

I uploaded files to the /src/assets folder

I uploaded files to the /src/assets folder

I added a route

I added a route

I removed unnecessary html

I removed unnecessary html

I enabled allowSyntheticDefaultImports

I enabled allowSyntheticDefaultImports

I added scripthost

I added scripthost

I encountered a VideoFrameCallbackMetadata issue

I encountered a VideoFrameCallbackMetadata issue

I updated the budgets

I updated the budgets

The app was running

The app was running

References

Using Phaser in an Angular 8 Component

Github