extending Phaser.Text class

[kudefe]

Hello. I'm new to Phaser and kind of new to javascript so please bear with me:

I'm using this Es6 Phaser boilerplate and in there, there's a Phaser.Sprite extension called Mushroom:

   

 import Phaser from 'phaser'
    
    export default class extends Phaser.Sprite {
    
      constructor ({ game, x, y, asset }) {
        super(game, x, y, asset)
    
        this.game = game
        this.anchor.setTo(0.5)
      }    
      update () {
        this.angle += 1
      }    
    }

So I tried to replicate this in the Phaser.Text Class like this:

   

import Phaser from 'phaser'    
    
    export default class extends Phaser.Text {
      constructor({game, x, y, text, style}){
        super(game, x, y, text, style)
    
        this.game = game
        this.anchor.setTo(0.5)
    
      }    
    }

and then called it on the Game.js file, just like in the example:

   

 this.texto = new Texto({
          game: this,
          x: 0,
          y:0,
          text:"hola mundo"
        })
    
        this.game.add.existing(this.texto)

but this is the result:

Quote

Uncaught TypeError: Cannot read property 'resolution' of undefined

How can I properly extend Phaser.Text or create a reusable class?

What am I doing wrong?

Thanks!

 

[drhayes]

In your code sample, you are passing "this" as the game -- but, later, you write "this.game.add.existing". So is the game instance in "this" or is it "this.game"? Try passing "game: this.game" to your Texto constructor.

Also, you don't need to say "this.game = game;" inside your custom class constructor. The Phaser.Text (and Sprite) parent class will do that for you.