Phaser: armature is undefined

[VioletFlare]

Phaser version: 3.16.2 DragonBones version: 5.7.000

Code: https://gist.github.com/VioletFlare/ed37a6737509d02a9e4e8072b4d2a64c

Error: Uncaught TypeError: Cannot read property 'display' of undefined

Code of the offending method: https://gist.github.com/VioletFlare/8b1170223bfed29d4de35e81de202356

Explanation: I had already a working phaser project but couldn't make it work with dragon bones so I decided to set up this one file and see what is wrong. I tried importing dragon bones using the global config in the readme, it didn't work the asset loading function this.load.dragonbone wasn't getting defined properly. Looking at the plugin's code I figured out I should import the plugin using the new plugins.installScenePlugin method introduced in phaser 3.8 and I couldn't get past this problem.

I have tried 3.12, 3.15 and 3.16 phaser versions to no avail, getting always the same error.

[jcyuan]

please refer to these demos:

https://github.com/DragonBones/DragonBonesJS/tree/master/Phaser/Demos/src

[VioletFlare]

Hi jcyuan, I have already tried the demos but I have been having trouble making them work. I'm going to try again this weekend and then I'll give you feedback asap. Thanks for the response, I really appreciate it.

[VioletFlare]

Hi! I just downloaded this repo.

1. I positioned myself inside DragonBonesJS/Phaser/Demos
2. I ran "npm i"
3. I ran "npm run start"

I visited the site and I'm getting this: Error: Please add the dragonbone plugin in your GameConfig

I tried rebuilding.

1. I positioned myself inside DragonBonesJS/Phaser/Demos
2. I ran "npm run build"
3. I ran "npm run start"

I got again: Error: Please add the dragonbone plugin in your GameConfig

The demo's index.html already configures Phaser. https://github.com/DragonBones/DragonBonesJS/blob/master/Phaser/Demos/index.html

Demo's versions: Phaser: 3.12 dragonBones.DragonBones.VERSION: 5.7.000.

[VioletFlare]

Update:

I managed to make it work. Unfortunately I wasn't able to include the dragonBones plugin the way it gets included inside the demo index.html.

Instead, I used the installScenePlugin method from before.

What i did:

1. I rewrote BaseDemo and HelloDragonBones to plain js
2. Inside BaseDemo preload() i included:

this.plugins.installScenePlugin('dragonBones', dragonBones.phaser.plugin.DragonBonesScenePlugin, 'dragonbone', this); 

Code: https://github.com/VioletFlare/db-test

Phaser Version: 3.16.2 dragonBones.DragonBones.VERSION: 5.7.000.

[glaucomorais]

So, I made a workaround from this issue creating a typing definition file that extends Phaser with DragonBones plugins methods: https://gist.github.com/glaucomorais/15eb97215754cbd36ee9065a149210f8

With this, I managed to have the most recent Phaser 3 master branch working with the master branch of DragonBonesJS Phaser plugin.

And, I must declare the DragonBones plugin at "scene" property of "plugins" configuration of the game. Like this:

export const config: GameConfig = {
  title: "Hello, DragonBones!",
  width: 800,
  height: 600,
  backgroundColor: "#f3008e",
  scene: Scene,
  plugins: {
    scene: [
      {
        key: "DragonBones",
        plugin: dragonBones.phaser.plugin.DragonBonesScenePlugin,
        mapping: "dragonbone", start: false
      }
    ]
  }
};

[jcyuan]

@glaucomorais @VioletFlare this is correct, the plugin is updated as a ScenePlugin instead of a GlobalPlugin, cause for a scene plugin they can be paused for different each scenes and managed seperatedly.