Förklaring

getStaticProps, getServerSideProps, och getStaticPaths är data-hämtningsmetoder från Pages Router. I App Router hämtas data direkt i server-komponenter med async/await utan dessa funktioner. Exporterar du dem från en app/-fil ignoreras de och Next.js visar ett fel.

Migreringen är mer konceptuell än syntaktisk: i App Router finns ingen separation mellan komponentdefinition och datafetching. Server-komponenten är själva datafetching-lagret.

Vanliga orsaker

Kopierad kod från Pages Router till App Router. Migrering från Pages Router utan att anpassa data-hämtningslogiken.

Lösning

Hämta data direkt i server-komponenten:

// Pages Router — fungerar inte i app/
export async function getStaticProps() {
  const data = await fetch('https://api.example.com/data').then(r => r.json());
  return { props: { data } };
}

// App Router
export default async function Page() {
  const data = await fetch('https://api.example.com/data').then(r => r.json());
  return <div>{data.title}</div>;
}

För ISR-beteende används next: { revalidate: 60 } i fetch-anropet i stället för revalidate i getStaticProps.