getStaticProps não roda

import Link from '../src/components/Link'

export async function getStaticProps() {
    const FAQ_API_URL = "https://gist.githubusercontent.com/omariosouto/0ceab54bdd8182cbd1a4549d32945c1a/raw/578ad1e8e5296fa048e3e7ff6b317f7497b31ad9/alura-cases-faq.json";

    const faq = await fetch(FAQ_API_URL)
        .then((response) => response.json())
        .then((response) => {
            console.log("1", response);
            return response;
        });
    console.log("2", faq);
    
    return {
        props: {
            faq
        }
    };
}

export default function FAQPage({ faq }) {
    console.log("3", faq);
    return (
        <div>
            <h1>Alura Cases - FAQ</h1>
            <Link href="/">
                Ir para a Home
            </Link>
            <ul>
                {faq.map(({ answer, question }) => (
                    <li key={question}>
                        <article>
                            <h2>{question}</h2>
                            <p>{answer}</p>
                        </article>
                    </li>
                ))}
            </ul>
        </div>
    )
}

Em yarn dev os 3 consoles dao undefined. No log do yearn export os 2 primerios fucnionam, porém o 3 da undefined.

Se o getStaticProps não está sendo executado corretamente, é possível que o problema esteja relacionado à sua configuração do Next.js ou à forma como você está chamando essa página.

Aqui estão algumas sugestões para solucionar o problema:

1. Verifique a Nomenclatura do Arquivo:

   • Certifique-se de que o arquivo que contém o código acima está nomeado corretamente, seguindo a convenção do Next.js. Se você estiver usando a versão mais recente, o arquivo deve ser nomeado como [nome].js ou [nome].tsx.

2. Verifique a Rota no Arquivo pages:

   • Certifique-se de que a página está configurada corretamente no diretório pages. Se estiver dentro de uma pasta, a estrutura de pastas também deve estar correta.

3. Reinicie o Servidor de Desenvolvimento:

   • Às vezes, problemas temporários podem ser resolvidos simplesmente reiniciando o servidor de desenvolvimento. Pare o servidor (Ctrl + C no terminal) e reinicie-o com yarn dev.

4. Atualize as Dependências:

   • Verifique se todas as suas dependências, incluindo o Next.js, estão atualizadas para as versões mais recentes. Você pode usar yarn outdated para verificar as versões desatualizadas.

5. Verifique se o Arquivo Está no Local Correto:

   • Certifique-se de que o arquivo com o código fornecido está no local certo dentro do diretório pages.

6. Verifique o Log do Terminal para Erros:

   • Examine a saída do terminal quando você inicia o servidor de desenvolvimento para ver se há mensagens de erro ou avisos.

7. Verifique o Console do Navegador:

   • Abra o console do navegador (geralmente Ctrl + Shift + J ou Cmd + Option + J), recarregue a página e veja se há mensagens de erro.

8. Tente com getServerSideProps:

   • Como uma solução alternativa, você pode tentar mudar de getStaticProps para getServerSideProps para ver se isso resolve o problema temporariamente. Isso pode ajudar a identificar se o problema está relacionado à geração estática.

Se, após verificar esses pontos, você ainda estiver enfrentando problemas, pode ser útil fornecer mais informações sobre a estrutura do seu projeto, versões das dependências, e mensagens de erro específicas que você está recebendo para uma análise mais aprofundada.

1. Nome correto, faq.js
2. Está em pages
3. Servidor reiniciado várias vezes
4. Apenas o next não esta em sua última versão, tento forçar a ultima 14.0.2 , porem instala a 13.5.6. Os outros estao em sua ultima versão.

Ainda assim, essa funcionalidade foi introduzida em 9.3.0 e teve sua ultima atualização na 13.4.0: https://nextjs.org/docs/pages/api-reference/functions/get-static-props#version-history

1. Sim, está em pages

2. Com yarn dev Map da erro pois faq é undefined

Existem 3 logs nesse arquivo, o 1 e o 2 printam o conteudo de faqs corretamente, o 3 da undefined

Com yarn dev Map da erro pois faq é undefined

1. Tentarei o getServerSideProps que é a proxima aula, realmente não consegui fazer funcionar.

{
  "name": "alura-cases-divulgacao",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^6.4.2",
    "@fortawesome/free-solid-svg-icons": "^6.4.2",
    "@fortawesome/react-fontawesome": "^0.2.0",
    "next": "^13.5.5",
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  },
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "export": "next build && next export",
    "go": "next build && next export && npx http-server ./out -c-1",
    "start": "next start",
    "lint": "next lint"
  }
}

Obrigado pela ajuda.

O problema é que eu estava usando "pro"ps ao invés de "pageProps" em _app

import GlobalStyle from '../src/theme/GlobalStyle'

function MyApp({Component, pageProps }) {
    return (
        <>
            Middleware
            <GlobalStyle/>
            <Component {...pageProps } />
        </>
    )
}

export default MyApp;

Obrigado.