Estoy tratando de usar graphcms para mis activos de imagen y cargarlos en mi frontend Next JS (v12.0.1). Sin embargo, solo arroja este nombre de hostname not configured in next.config.js aunque ya lo especifiqué en mi archivo next.config.js de la siguiente manera.

 module.exports = { images: { domains: ['media.graphcms.com','media.graphassets.com'], } };

Lo estoy cargando en un componente con esta consulta usando @apollo/client :

 import Page from '@components/page'; import TeamMembersGrid from '@components/team-members-grid'; import Layout from '@components/layout'; import Header from '@components/header'; import { META_DESCRIPTION } from '@lib/constants'; import { gql, useQuery } from '@apollo/client'; const TEAM_MEMBERS = gql` query TeamMember { teamMembers { phoneNumber name id emailAddress subsystem role experienceLevel profileImage { url } } } `; const TeamMembers = () => { const { data } =useQuery(TEAM_MEMBERS); const team = data?.teamMembers const meta = { title: 'Raftar Formula Racing', description: META_DESCRIPTION }; return ( <Page meta={meta}> <Layout> <Header hero="The Crew" description={meta.description} /> {team && <TeamMembersGrid teamMembers={team}/>} </Layout> </Page> ); } export default TeamMembers

¿Puede alguien decirme qué está fallando exactamente aquí?