Image is not getting added to the scene -Phaser 3.5

I am trying to learn phaser js but have been stuck on figuring out why my background images are not displaying to the scene. I have tried moving the image file to different locations and also tried doing function declarations instead of methods everything with the same result. Thank you in advance for any guidance you may be able to provide! Btw I am using parcel-bundler Code & screenshot

Screenshot

First is main.js

import Phaser, { Physics } from "phaser"  import { TitleScene } from "./scenes"    const GameConfig = {    width: 800,    height: 500,    type: Phaser.AUTO,    physics: {      default: "arcade",      arcade: {        gravity: {          y: 0,        },      },    },  };    const game = new Phaser.Game(GameConfig);    game.scene.add("title", TitleScene);    game.scene.start("title");

This is my scenes.js files:

import Phaser, { Textures } from "phaser"    export class TitleScene extends Phaser.Scene {      preload() {          this.load.image("sky", "sky.png");      }        create() {         this.add.image(400, 250, "sky");         const titleText = this.add.text(400, 250, "Hello World!");         titleText.setOrigin(0.5,0.5);       //this.add.arc(400, 250, 128, 0, 360, false, 0xff0000);                }  };    export class GameScene extends Phaser.Scene {      preload() {        }        create() {        }  }

https://stackoverflow.com/questions/66878947/image-is-not-getting-added-to-the-scene-phaser-3-5 March 31, 2021 at 05:54AM