I am currently working on a website using Next.js version 13.0. After running the next build command, I noticed that all pages are functioning properly except for the root page. The issue is that it's being generated as a static page instead of dynamic. Despite having
export const dynamic = "force-dynamic"Here is 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 suggestions or insights on how to resolve this issue?