Es mi primera vez publicando aquí.
Tengo un problema con la forma en que se generan las rutas de compilación de producción a mis imágenes cuando ejecuto npm run build .

Tengo algunos logotipos para mostrar en uno de mis componentes de React, que se muestran correctamente en el servidor local... el problema surge cuando implemento en Netlify.

Este es el código que uso para obtenerlos dinámicamente:

 currentProject.icons.map(el => { return ( <div key={el.id} className={styles.logo}> <div className={styles["logo-wrap"]} style={{ margin: ".3rem 0" }} > {el.icon} <p>{el.tag}</p> </div> </div> ); })}

Este es el resultado en localhost:

Pero este es el resultado en producción:

Ahora, noté que en la compilación de producción, la imagen src es incorrecta (./ en lugar de ../), ya que cuando modifico la ruta en las herramientas de desarrollo, aparece la imagen correcta.

Mis imágenes están en public/Icons pero las estoy importando a las propiedades de mis proyectos para poder renderizarlas dinámicamente.

Antes:

Después de agregar un . a la ruta del archivo:

Esta es la estructura de carpetas:

En este momento solo estaba probando con el logotipo de React, pero antes también estaba tratando de importarlos desde src/assets/Logos, pero el resultado es el mismo en localhost.

¿Como puedo solucionar este problema?