Example project for Spine animations in Phaser 3 with TypeScript plus SpinePlugin typing files! π
You can find a guide explaining this project here.
https://ourcade.github.io/phaser3-typescript-spine/
This example project uses the phaser3-parcel-template and requires Parcel.
Clone this repository to your local machine (or download from Github or use a tool like Degit):
git clone https://github.com/ourcade/phaser3-typescript-spine.git my-project-folder
Go into your project folder and install dependencies:
cd my-project-folder
npm install
Start development server:
npm run start
You'll see Spine Boy in his idle animation. Press the left
and right
arrow keys to cycle through his other animations. π
Demo: https://ourcade.github.io/phaser3-typescript-spine/
βββ ...
βββ public
β βββ assets
β β βββ spine
β β β βββ spineboy.atlas
β β β βββ spineboy.json
β β β βββ spineboy.png
βββ src
β βββ scenes
β β βββ SpineDemo.ts
β βββ types
β β βββ globals.d.ts
β βββ index.html
β βββ main.ts
The Spine Boy assets exported from Spine is in public/assets/spine
. These files are loaded in the preload()
method of SpineDemo.ts
.
The Phaser 3 SpinePlugin is loaded in main.ts
.