I deployed a site with react and it does not show all of the images. I used js to import all the images
import productImg1 from "./images/products/product-1.jpg";
import productImg2 from "./images/products/product-2.jpg";
import productImg3 from "./images/products/product-3.jpg";
import productImg4 from "./images/products/product-4.jpg";
import productImg5 from "./images/products/product-5.jpg";
import productImg6 from "./images/products/product-6.jpg";
import productImg7 from "./images/products/product-7.jpg";
import productImg8 from "./images/products/product-8.jpg";
import productImg9 from "./images/products/product-9.jpg";
export default [
productImg1,
productImg2,
productImg3,
productImg4,
productImg5,
productImg6,
productImg7,
productImg8,
productImg9
];
And added the images like this
import product from "../images";
<img class="feature-image" src={product[3]} alt="" />
or
import Logo from "../images/logos/logo_square-removebg-preview.png";
<img class="logo-image" src={Logo} alt="Beachside bakery logo" />
it works fine on codesandbox but it wouldn’t on netlify. I’ve tried disabling asset optimization and it didn’t work. How do I fix this?
github : GitHub - gleny4001/beachside-bakery: Created with CodeSandbox
codesandbox : beachsidebakery-main - CodeSandbox
netlify : https://beachside-bakery.netlify.app/