CODEWITHSUNDEEP
typescriptnext.js
NateDavis
NateDavis

Reputation: 295

Next.js 13 - Why isn't my root page dynamic

I am making a website with Next.js 13.0. When I run next build, all the pages work except my root page. It's being built as static when I want it to be dynamic. I even have export const dynamic = "force-dynamic" in my code yet it continues to build as a static page. It's no different from my dynamic pages so I don't get what's the problem.

The code for src/app/page.tsx:

import { collection, getDocs, limit, orderBy, query } from "firebase/firestore"
import Article from "@components/Article"
import { ArticleData } from "@types"
import { db } from "@firebase"

export const dynamic = "force-dynamic"

const getArticles = async () => {
  const articles: ArticleData[] = []

  const snapshot = await getDocs(
    query(collection(db, "articles"), orderBy("created", "desc"), limit(5))
  )

  snapshot.forEach((doc) => {
    articles.push({
      ...doc.data(),
      id: doc.id,
    } as ArticleData)
  })

  return articles
}

const Home = async () => {
  const articles = await getArticles()

  return (
    <>
      {articles.map((data, i) => (
        <Article key={i} data={data} />
      ))}
    </>
  )
}

export default Home

Any ideas?

Upvotes: 4

Views: 9930

Answers (2)

moundziegou gabin
moundziegou gabin

Reputation: 59

Replace this export const dynamic = "force-dynamic" by this code export const revalidate = 0

My source https://supabase.com/blog/fetching-and-caching-supabase-data-in-next-js-server-components

Upvotes: 5

Hilmir Straumland
Hilmir Straumland

Reputation: 31

I had the same problem and found a solution.

If you add the Dynamic functions like cookies() and headers() to a server side page you will force the page to be dynamic.

Example

import { headers } from 'next/headers';

export default async function page() {
    const headersList = headers();
    
    //...
    
}

I found this solution in the next.js docs under the heading Default Caching Behavior

Hope this helps

Upvotes: 0

Related Questions