I can't add image neither background images nor sprites

Phaser 3
1

I am a complete beginner to phaser. I look forward to making games using phaser.

I have tried many times but I don’t know why I can’t add image or sprite to my game. But if i add some web links then image gets added.
Please help me. And what is assets? Should image files be stored in assets?

2

Hi,
Show us your code please, and how do you launch the game?

3

Thanks for trying to help me…

This is my game.js code
const gameState = {
}
function preload(){
this.load.image(‘pixel’, ‘assets/pixel.png’);
this.load.image(‘background’, ‘assets/background.jpg’);

}
function create(){
this.add.image(0,0,‘background’),
gameState.circle =this.add.sprite(50,50,‘pixel’)
gameState.cursors = this.input.keyboard.createCursorKeys()
}
function update(){
if (gameState.cursors.down.isDown){
gameState.circle.y +=2;
}
if (gameState.cursors.up.isDown){
gameState.circle.y -=2;
}
if (gameState.cursors.left.isDown){
gameState.circle.x -=2;
}
if (gameState.cursors.right.isDown){
gameState.circle.x +=2;
}
}
const config ={
height:650,
width:700,

scene: {
preload,
create,
update,
}
}
const game = new Phaser.Game(config);

My folder structure is like:
my_game-- game.js, assets
assets-- background.jpg, pixel.png

I have my images saved in assets file. But it won’t work. Why?

Instead I see this imageScreenshot_1

4

Hi,
You must indicate the relative path to your web page.
Example:

root_folder
│   index.html    
│
└───my_game
│   │   game.js
│   │
│   └───assets
│       │   background.png
│       │   pixel.png

In this example index.html is in the root folder, so the path to load assets is: my_game/assets/

Regards.

5

Are you running the code from a local web server?

6

no i just downloaded phaser.min.js code and wrote index.html code

7

my_game is the root folder for me and inside it i have index.html, game.js and assets?

8

See the Getting Started with Phaser 3 tutorial. You must run your game from a local web server.

9

Okay. Thanks