trying to make tiled map load in JS using phaser and wont work?

i am trying to use Phaser3 to create a web based game for my course and I am using tiled to create the maps. I have saved the tiled map as a .json file and I cant load the level I designed. The code i am using is from a tutorial as seen below. The problem is it is only showing a black screen when loading and the tilemapTiledJSON function is coming up as an unresolved function instead of working how it should. i am Webstorm for the coding and i am using phaser 3.50.0.

const config = {
    type: Phaser.AUTO, // Which renderer to use
    width: 800, // Canvas width in pixels
    height: 600, // Canvas height in pixels
    parent: "game-container", // ID of the DOM element to add the canvas to
    scene: {
        preload: preload,
        create: create,
        update: update
    }
};

const game = new Phaser.Game(config);

function preload() {
    this.load.image("tiles", "../Assets/Tileset/GB_TileSet_Cemetery_16x16_Sheet.png");
    this.load.tilemapTiledJSON("map", "../Assets/Level/Cemeterymap.json");
}

function create() {
    const map = this.make.tilemap({ key: "map" });

    // Parameters are the name you gave the tileset in Tiled and then the key of the tileset image in
    // Phaser's cache (i.e. the name you used in preload)
    const tileset = map.addTilesetImage("cemetery 5", "tiles");

    // Parameters: layer name (or index) from Tiled, tileset, x, y
    const belowLayer = map.createStaticLayer("Base", tileset, 0, 0);
    const worldLayer = map.createStaticLayer("Base objects", tileset, 0, 0);
    const aboveLayer = map.createStaticLayer("Non Collision objects", tileset, 0, 0);
}

function update(time, delta) {
    // Runs once per frame for the duration of the scene
}