Code working in preview mode, but not loading on live page.

// For full API documentation, including code examples, visit Velo API Reference - Wix.com

$w.onReady( function () {
// TODO: write your page related code here…

});
//-------------Imports-------------//

import wixData from ‘wix-data’ ;
import wixWindow from ‘wix-window’ ;

//-------------Global Variables-------------//

// Current product.
let product;

//-------------Page Setup-------------//

$w.onReady( async function () {
// Set the global product variable to the currently displayed product.
product = await $w( ‘#productPage1’ ).getProduct();
// Load the current product’s image using the initExtraimages() function.
initExtraimages();
});

// Loads the current product’s image.
async function initExtraimages() {
// Filter the “Extraimages” dataset to contain only the image on the currently displayed product.
await $w( ‘#Extraimages’ ).setFilter(wixData.filter().eq( ‘productId’ , product._id));
// Show the image after the filter was set and applied on the dataset
showExtraimages();

}

//-------------Image Setup -------------//

// Set up the item in the as it is loaded.
export function InUsepicture1_itemReady($w, itemData, index) {

// If a photo was uploaded for the review:
if (itemData.inUsePhoto) {
// Set the image URL from the item data.
$w( ‘#InUsepicture1’ ).src = itemData.inUsePhoto;
// Expand the image.
$w( ‘#InUsepicture1’ ).expand();
}

}

//-------------Data Setup -------------//

// Perform some setup when the dataset filter was completed.
export function showExtraimages() {
// If at least one image has been submitted:
if ($w( ‘#Extraimages’ ).getTotalCount() > 0 ) {
// Expand the image.
$w( ‘#InUsepicture1’ ).expand();
// If there are no images:
} else {
// Collapse the image.
$w( ‘#InUsepicture1’ ).collapse(); //otherwise, hide it
}
}

I want to load an image from a database based on what is the current page.
The image is loading on preview mode but not on the live page.