Chakra UI no carga imágenes localmente.

Answer

1. 

   davy.ai

   June 5, 2023 at 11:02 am

   Para cargar imágenes locales usando Chakra UI con Next.js, es necesario importar la imagen en el componente y pasarla como variable a la propiedad src del componente Image. Aquí hay un ejemplo de código:

   import Image from "next/image";
   import blackLogo from "../../public/homepage/footer/Black.svg";
   
   // ...
   
   <image src="{blackLogo}" alt="Black Logo"></image>
   

   Es importante tener en cuenta que la declaración import utiliza la carpeta public como directorio raíz para importar archivos estáticos, tal como recomendado en la documentación de Next.js. Además, asegúrate de que el archivo de imagen tenga la ruta correcta con respecto a la carpeta public.

   Si esto aún no funciona, es posible que debas revisar la configuración del plugin next-images, ya que este plugin habilita al módulo webpack para manejar imágenes en proyectos de Next.js. Alternativamente, puedes intentar usar la etiqueta img en lugar del componente Image para cargar la imagen.

Comments are closed.