Tengo imágenes en un carrusel:
<Image src={`http://ticket-t01.s3.eu-central-1.amazonaws.com/${props[organizationId].events[programId].imgId}_0.cover.jpg`} className={styles.carouselImage} layout="responsive" width={865} height={513} key={`${props[organizationId].events[programId].imgId}`} priority={true} /> Creo que todos los src están bien configurados, ya que las imágenes son visibles y renderizadas. ¿Entonces cuál es el problema?
Veo esto en la consola:
tiene un valor `imagesrcset` no válido
Se ha presentado un error con Safari , que parece ser el único navegador que se queja.
Creo que puedes ignorar este error con seguridad.
debe agregar esto a su archivo next.config.js
module.exports = { images: { domains: ["amazonaws.com"], }, }de los documentos :
Para habilitar la optimización de imágenes para imágenes alojadas en un sitio web externo, use una URL absoluta para Image src y especifique qué dominios se pueden optimizar. Esto es necesario para garantizar que no se pueda abusar de las URL externas.
si es una imagen local, necesita importarla y luego usarla
import dogImg from '../public/dog1.png' <div> <Image src={dogImg} /> </div>