htmlphaser-framework

phaser game not working class extends problem


I'm designing for a project and it is saying this to my scenes and its just one blank screen that's white

when I check debug I get this:

Uncaught TypeError: Class extends value undefined is not a constructor or null

here is my index file

<!doctype html> 
<html lang="en"> 
<head> 
    <title>save the mahanadi river, an energy project</title>  
     <!--libs-->
     <script src="//cdn.jsdelivr.net/npm/phaser@3.24.1/dist/phaser.js"></script>
     <!--project-->
     <script type = "text/javascript" src = ".js/game.js"></script>
     <!--scenes-->
     <script type = "text/javascript" src = "scenes/boot.js"></script>
     <script type = "text/javascript" src = "scenes/menu.js"></script>
</head>
<body>
   <H1>hello for now</H1> 
</body>
</html>

and my scene prob code

class Boot extends Phaser.scene {
    constructor() {
        super("Boot")
    };

    preload (){
        
    };

    create (){
        this.add.text(20, 20, "welcome!")
    };

    update (){
        
    };
};

here is my game.js

    window.onload = function(){
        var config = {
            type: Phaser.AUTO,
            width: 800,
            height: 600,
            physics: {
                default: 'arcade',
                arcade: {
                    gravity: { y: 300 },
                    debug: false
                }
            },
            scene: {
                preload: preload,
                create: create,
                update: update
            }
        };
    
        var game = new Phaser.Game(config);
    }


ok thanks photon storm but i still have bugs 

my game.js

window.onload = function(){
    var config = {
        type: Phaser.AUTO,
        width: 800,
        height: 600,
        Scenes: [Boot,Menu],
        Scenes.push(Boot),
        Scenes.push(Menu),
        physics: {
            default: 'arcade',
            arcade: {
                gravity: { y: 300 },
                debug: false
            }
        },
    };

    var game = new Phaser.Game(config);

    
    
}

its giving probs at phaser.push


Solution

  • If you are going to use a class for your Scene, then you need to change your Game Config to reflect this. At the moment it's still using the old 3-function approach, but you need to tell it you're using a Scene class now:

    scene: [ Boot ]
    

    Where 'Boot' is your Boot Scene. Adding more Scenes? Append them to this array. The first one in the list is started automatically.