Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

107
Visualizações
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 Respostas
Responde à pergunta

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 Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda