Lukripar Posted May 25, 2018 Share Posted May 25, 2018 I'm trying to code a simple game using scenes. I am new to Phaser 3 and relatively new to coding in general so I may be making a dumb mistake. I've just hit a wall. I'm trying to get my main menu "start" button to start the game state. Simple enough right? But when I run the files on http-server, i get: ``ncaught ReferenceError: Game is not defined at testmain.js:6`` my html: <!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>FCM Classes Test</title> <script src="//cdn.jsdelivr.net/npm/[email protected]/dist/phaser.js"></script> </head> <body> <canvas id="canvas"></canvas> <script type="module" src="js/testmain.js"></script> <script type="module" src="js/scenes/game.js"></script> <script src="js/scenes/mainMenu.js"></script> <script src="js/scenes/preload.js"></script> </body> </html> main.js var config = { type: Phaser.AUTO, width: 800, height: 800, parent: "#canvas", scene: [Preload, MainMenu, Game ], title: 'Fantasy Cage Match' } let game = new Phaser.Game(config); mainMenu.js let startButton, menubg; class MainMenu extends Phaser.Scene{ constructor() { super({key: "MainMenu"}); } create() { this.menubg = this.add.image(400,400,'menubg'); this.startButton = this.add.sprite(400, 400, 'startbutton').setInteractive(); this.startButton.on('pointerdown', function startGame(pointer){ this.scene.start('gamescene'); }, this); } } and my game.js I haven't added any other code because I just want to see my sprite move around on screen.. (I know i haven't done anything with cursors yet..) import Player from '../characters/Player.js' let bg, cursors, player; class Game extends Phaser.Scene{ constructor() { super({key: "gamescene"}); } create(){ bg = this.add.image(400,400,'background'); player = this.add.sprite(400,400,'dude'); this.player = new Player(this) setupCollision(this) } } First time posting, so I'm sorry if I didn't follow correct etiquette. Thanks in advance for any ideas. Link to comment Share on other sites More sharing options...
squilibob Posted May 25, 2018 Share Posted May 25, 2018 <script type="module" src="js/testmain.js"></script> Is this the name of your file? You said it was main.js not testmain.js? Link to comment Share on other sites More sharing options...
michebn Posted May 27, 2018 Share Posted May 27, 2018 Hey. I'm a Javascript beginner to (coming from cpp/python) so I'm not sure I understood it correctly, but as far as I know the order of the script mathers... When the browser reaches your testmain.js it trys to run it and therefor create your game. But at this time, your other scripts didn't run and therefor your scenes are not defined. So you could try moving your main script at the end or (probably even better) use window.onload = function () { var game = ... } Not sure if this is the problem though.. Edit: As noted in the other post, it might be helpfull to set up some sort of development toolchain that handels all the importing stuff for you... It helped me to get something on the browser anyway. Link to comment Share on other sites More sharing options...
Recommended Posts