Error with Property/Fields in typescript class

[ArnaudDroxler]

Version

• Phaser Editor Version: Phaser Editor 2D - 2.1.6.20200120
• Operating system: windows 10

Description

I am quite new to the phaser environment, and I was testing Phaser editor with typescript. I have an issue with properties in scene class. If y use the button for assigning a property on an object in scene or declare a simple string as a class fields. The game load an empty scene at play and show an error in the browser console Uncaught SyntaxError: Unexpected identifier

I am sure that I miss something but I don’t understand why.

// You can write more code here

/* START OF COMPILED CODE */

class Scene1 extends Phaser.Scene {

    constructor() {

        super("Scene1");

    }

    _preload() {

        this.load.pack("pack", "assets/pack.json");

    }

    _create() {

        this.add.image(380.01807, 270.19016, "BG");

        var fufu = this.add.image(414.1096, 257.46225, "fufu", 0);

        this.fFufu = fufu;

    }

    private fFufu: Phaser.GameObjects.Image;

    /* START-USER-CODE */

    public str:string = "";

    create() {
        this._create();

    }

    /* END-USER-CODE */
}

/* END OF COMPILED CODE */

[PhaserEditor2D]

Hi @ArnaudDroxler

What file are you loading in the pack file, the .js file, or the .ts file?

The browser founds a syntax error. At a glance I don't see any syntax error in your TypeScript.

[ArnaudDroxler]

Hi

I load the .ts file pack file, by default it was the .js but nothing show in th screen so y change it. I think i miss something about how typescript works in PhaserEditor.

[PhaserEditor2D]

You cannot load the TypeScript file, the browser does not understand it. You should load the JavaScript file. If it shows an error please paste it here, I can help you.

[ArnaudDroxler]

Okay, actually, it was dumb. So I try to create a new project, import some assets, and add some to the scene. But if I play the game, nothing shows up, all my modification is generated in the .ts file and there is nothing in the .js file. So how in to compile the .ts file into the .js file automatically.

[PhaserEditor2D]

Hi,

You can run the typescript compiler in watch mode:

https://stackoverflow.com/questions/12799237/how-to-watch-and-compile-all-typescript-sources

$ cd /path/to/ptoject/WebContent
$ tsc -w

You can do this with the Windows CMD or using the Terminal view in Phaser Editor (Ctrl+3 search for Terminal view).

[ArnaudDroxler]

Hi,

Thank you for the response, it’s working great now. I thought that the phaser editor will directly compile ts into js.

[PhaserEditor2D]

Great.