Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

104
Vistas
getStaticPaths not creating paths

I have data folder that contains events.ts:

export const EventsData: Event[] = [
  {
    name: 'School-Uniform-Distribution',
    images: ['/community/conferences/react-foo.png', "/community/conferences/react-foo.png"],
  },
  {
    name: 'College-Uniform',
    images: ['/community/conferences/react-foo.png', "/community/conferences/react-foo.png"],
  },
];

type Event is:

export type Event = {
  name: string;
  images: string[];
};

I have the getStaticPath and getStaticProps methods in pages/our-contribution/[pid].tsx :

export const getStaticProps: GetStaticProps<Props> = async (context) => {
  const event = EventsData;
  console.log(event, "event")
  return {
    props: { event: event },
  };
};

export async function getStaticPaths() {

  // Get the paths we want to pre-render based on posts
  const paths = EventsData.map(event => ({
      params: {pid: event.name},
  }));
  console.log(paths, "paths")
  // We'll pre-render only these paths at build time.
  return {paths, fallback: false}
}

I get this error: enter image description here

Can you help me, please ?

Update: This is the error trace for one route: enter image description here

pages/our-contribution/[pid].tsx:

import { useRouter } from 'next/router';
import { GetStaticProps } from 'next';

import { Event } from 'types/event';
import {EventsData} from 'data/events';

type Props = {
  event: Event[];
};

const Event = ({event} : Props) => {
  const router = useRouter()
  const { pid } = router.query

  return <p>Event: {event}</p>
}

export const getStaticProps: GetStaticProps<Props> = async (context) => {
  const event = EventsData;
  console.log(event, "event")
  return {
    props: { event: event },
  };
};

export async function getStaticPaths() {

  // Get the paths we want to pre-render based on posts
  const paths = EventsData.map(event => ({
      params: {pid: event.name},
  }));
  console.log(paths, "paths")
  // We'll pre-render only these paths at build time.
  return {paths, fallback: false}
}

export default Event
about 4 years ago · Santiago Trujillo
1 Respuestas
Responde la pregunta

0

I think there are a couple of errors in the code. One error that block your build is

const Event = ({event} : Props) => {
  const router = useRouter()
  const { pid } = router.query

  return <p>Event: {event}</p>
}

You can't directly print an object or array in tsx, you should convert the object first into string if you are trying to debug it. Something like:

  return <p>Event: {event.toString()}</p>

Then a i notice something strange in your variables name event props looks like a single event but instead you give an array of events i don't know if it is correct but maybe it should be like this:

type Props = {
  event: Event;
};

or it should be named:

type Props = {
  events: Event[];
};
about 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda