Ionic 6 with phaser 3 getting error when I using 'fill'?

Phaser 3
1

Hello everyone,
I would like to integrate my game to ionic.
but I find when I type color code get the below error

this.scoreText = this.add.text(16, 16, 'score: 0', { fontSize: '32px', fill: "#000" });

error message

(property) fill: string
Argument of type '{ fontSize: string; fill: string; }' is not assignable to parameter of type 'TextStyle'.
  Object literal may only specify known properties, and 'fill' does not exist in type 'TextStyle'.ts(2345)

export class GameScene extends Phaser.Scene {
  cursors: Phaser.Types.Input.Keyboard.CursorKeys;
  platforms: Phaser.Physics.Arcade.StaticGroup;
  player: Phaser.Physics.Arcade.Sprite;
  scoreText: Phaser.GameObjects.Text; // I try to set it any, but not work

  constructor() {
    super({ key: 'game' });
  }
.......
  create() {
 this.scoreText = this.add.text(16, 16, 'score: 0', { fontSize: '32px', fill: "#000" }); //error in fill: "#000" 
  }
......

Anyone know how to fix it ??? thank you very much

2

Example-Space-Game

There is no problem on the web, I tested it. probably { fontSize: string; fill: string; } There is a problem here.

'{ fontSize: string; fill: string; }'
3

Thank you for reply
I am using { fontSize: string, fill: string } indeed , Not use ;

helloworld
helloworld1962×342 86.8 KB

But Finally
I find that solution that downgrade my project to ionic 5
“@ionic-native/core”: “^5.0.7”,
“@ionic-native/splash-screen”: “^5.0.0”,
“@ionic-native/status-bar”: “^5.0.0”,
It work fine now…

Is it possible to solve (property) fill: string. without downgrade
or i have missing something setting?? Thank you very much

4

Try color instead of fill.

5

Most likely, the incoming string value is not defined because there are no quotes. Please try the code below!

this.scoreText = this.add.text(16, 16, 'score: 0', { font: `$(string)`, fill: `$(string)` });
6

Please Kindly check this tutorial

just add
interface TextStyle {}

and change to
this.scoreText = this.add.text(16, 16, 'score: 0', { fontSize: '32px', fill: "#000" } as TextStyle);

it will work fine.