Expected '}' to match '{' from line 1 and instead saw 'create'.

[TheCodeCrafter]

I need help. I was following a tutorial online for the Phaser States, and I did everything right (I think), but obviously, I've made some changes myself to fit to what I kind of want. Here is the code:

 

var loadState = {
  preload: function() {
    
    // Load the BG Images (Before so we can have an awesome looking loading screen)
    game.load.image('redPlanet', '././assets/images/redplanet.png');
    game.load.image('spaceBG', '././assets/images/spaceBG.png');
    
    
    // Preload the one character we need to look awesome!
    game.load.image('scavenger', '././assets/images/Scavenger.png');
    
    
    // Add the loading label and the character, so the player doesn't think the game crashed.
    var background = game.add.sprite(0, 0, 'spaceBG');
    background.scale.setTo(0.6);
    var character = game.add.sprite(80, 150, 'scavenger');
    var loadingLabel = game.add.text(0, 0, 'Loading...', {font: '30px Courier', fill: '#fff'});
    loadingLabel.alignTo(character, Phaser.RIGHT_CENTER, 16);
    
    // Load the Planet Images
    game.load.image('planet1', '././assets/images/Planet1.png');
    game.load.image('planet2', '././assets/images/Planet2.png');
    game.load.image('planet3', '././assets/images/Planet3.png');
    game.load.image('planet4', '././assets/images/Planet4.png');
    game.load.image('planet5', '././assets/images/Planet5.png');
    game.load.image('planet6', '././assets/images/Planet6.png');
    game.load.image('planet7', '././assets/images/Planet7.png');
    game.load.image('planet8', '././assets/images/Planet8.png');
    game.load.image('planet9', '././assets/images/Planet9.png');
    game.load.image('planet10', '././assets/images/Planet10.png');
    game.load.image('planet11', '././assets/images/Planet11.png');
    game.load.image('planet12', '././assets/images/Planet12.png');
    game.load.image('planet13', '././assets/images/Planet13.png');
    game.load.image('planet14', '././assets/images/Planet14.png');
    
    // Load the pause button
    game.load.image('pauseButton', '././assets/images/pauseButton.png');
  }
  
  create: function() {
    game.state.start('menu');
  }
}

And that is not all. Every single one of my state files has an error that says:

Expected '}' to match '{' from line 1 and instead saw 'create'.
Missing Semi-Colon.
Unrecoverable Syntax Error (93% Scanned)

 

Please help me, as this was going to be the way I made my game because I really like how organized states are!

[mattstyles]

Where is that error coming from? Semi colons are not compulsory in js so the error is misleading so I'm curiously what is outputting the error.

however, you're just missing a closing brace somewhere, you probably deleted it when moving code around or just forgot to close it (most editors will automatically add closing braces when you start a block, but it's easy to delete it, again, if you indent properly, and your editor should help you, it's usually easy to spot).

You're also missing a comma, which is compounding the brace problem (I think, it's hard to tell reading this on my phone). 

[ldd]

        // Load the pause button
        game.load.image('pauseButton', '././assets/images/pauseButton.png');
    },

    create: function() {
        game.state.start('menu');
    }
}

There should be a comma BEFORE the word 'create'.

For this, and many other reasons, use an editor that supports linting (ESLint or jsHint) if you are using Webstorm, Sublime Text it is easy enough to set up.

Otherwise, change to an editor that supports those features. You are just going to go mad otherwise

[TheCodeCrafter]

Thanks a bunch! That helped. I actually haven't checked this post, but after some research, and making some tilemaps for fun because i was bored, I realized what was up. So thanks so much for taking the time to answer my question!!!

 

Thanks,

TheCodeCrafter