get() function returns an empty pixels array in p5.js

Question

The thing that i wanna do is similiar with this video. In p5.js, I am using get() function. After use this, I will create small images (by dividing big tileset) and push them into an array. But in my code get() returns an empty pixels array. Here is a part of my code:

tilesImages = [];  // tiles array
function preload() {
    let tilesImage = loadImage(TILEMAP_PATH + "tiles.png", () => {
        console.log("Tiles loaded successfully");  // It logs this
    }, () => {
        console.log("An error occured when tiles loaded");
    });
    for (let i = 0; i < TILE_HORIZONTAL; i++) {
        for (let j = 0; j < TILE_VERTICAL; j++) {
            let x = i * TILE_SIZE + TILES_SPACE;
            let y = j * TILE_SIZE + TILES_SPACE;
            if (i == 0) {
                x = 0;
            }
            if (j == 0) {
                y = 0;
            }
            var img = tilesImage.get(x, y, TILE_SIZE, TILE_SIZE);  // get tiles from tileset
            tilesImages.push(img);
        }
    }
}

function setup() {
    console.log(tilesImages[0].pixels);  // returns empty
}

I tried to use this but it just draws vertical pink lines to my small image.

My tileset: https://www.kenney.nl/assets/pixel-shmup (on right)

I am using single images now but I want to know the solution of this problem. Thanks