Search code examples
javascriptgame-physicsphaser-framework

Phaser 3 : Cannot read property '$' of undefined


So I was in the middle of game development with Phaser 3 and this error showed up in the console:

Cannot read property 'startSystem' of undefined

Here is my HTML code

<!DOCTYPE html>
<html lang="en">
<head>
    <style>
        * {
            padding:0px;
            margin: 0px;
            overflow: hidden;
        }

    </style>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Shoot'Em</title>
   <script src="phaser.min.js"></script>
   <script src="game.js"></script>
</head>
<body>
</body>
</html>

And here is my Javascipt/Phaser Code:

var config = {
    type: Phaser.AUTO,
    width: window.innerWidth,
    height:window.innerHeight,
    physics: {
        default: 'arcade',
        arcade: {
            gravity: { y: 300 },
            debug: false
        }
    },
    scene: {
        preload: preload,
        create: create,
        update: update
    }
};

var game = new Phaser.Game(config);
var platforms
function preload ()
{
    this.load.image('player1', 'Player.png')
    this.load.image('player2', 'Player2.png')
    this.load.image('platform', 'Platform.png')

}

function create ()
{
       🛑🛑🛑----➤game.physics.startSystem(Phaser.Physics.ARCADE);<---🛑🛑🛑🛑🛑
    
   
    //Create Platforms
    platforms.create(400, 568, 'platform').setScale(2).refreshBody();
    platforms.create(600, 400, 'platform').setScale(0.1).refreshBody();
    platforms.create(50, 250, 'platform').setScale(0.1).refreshBody();
    platforms.create(750, 220, 'platform').setScale(0.1).refreshBody();

    //Player 1
    player1 = this.physics.add.sprite(100, -200, 'player1');
    player1.setBounce(0.95);
    player1.setCollideWorldBounds(true);
    player1.body.setGravityY(300);
    this.physics.add.collider(player1, platforms);

    //Player 2
    player2 = this.physics.add.sprite(300, -200, 'player2');
    player2.setBounce(0.95);
    player2.setCollideWorldBounds(true);
    player2.body.setGravityY(300);
    this.physics.add.collider(player2, platforms);

 emitter = game.add.emitter(0, 0, 100);

    emitter.makeParticles('player1');
    emitter.gravity = 0;

    game.input.onDown.add(particleBurst, this);
    
}


function particleBurst(pointer) { 
    emitter.x = pointer.x;
    emitter.y = pointer.y;
    emitter.start(true, 2000, null, 10);
}

Where the stop signs are is where the program stops. I'm running on a local host. FYI ALL THE FILES USED IN THE CODE ARE IN THE SAME FOLDER

Any help will be welcomed!


Solution

  • There are some errors I found in your example, maybe these steps will help to fix it:

    1. You don't need to call game.physics.startSystem(Phaser.Physics.ARCADE); at all. Just remove this line.
    2. Add update function
    3. platforms.create will fail since platforms are not initialized. Here is example about groups
    4. game.add will also fail - you don't need game, use this to access current scene.

    There are a lot of examples with Phaser 2 that uses game, but in Phaser 3 you can just access the scene from create and update to add new objects.