Next.js Discord

Discord Forum

output: "export" for Blog

Unanswered
Persian posted this in #help-forum
Open in Discord
PersianOP
Hi, I want to build a blog and use the export in next.config.js.
When I start the app in dev mode it works fine, but when I run "next build" and start the app with "npx serve@latest out" I can't click on the post that is loaded from the database (export loads all posts when I build the app and create a static page?).
But the /blog page load all post that available.

/blog page
  const articles: BlogPost[] = await directus
    .items("articles")
    .readByQuery<any>({
      fields: ["*"],
      sort: ["-id"],
    })
    .then((response) => {
      if (response.data && response.data?.length !== 0) return response.data;
      notFound();
    });


/blog/slug page
  const article: BlogPost = await directus
    .items("articles")
    .readByQuery({
      fields: ["*"],
      filter: {
        slug: { _eq: slug },
      },
    })
    .then((response) => {
      if (response.data && response.data?.length !== 0) return response.data[0];
      notFound();
    });

8 Replies

I guess you are trying to setup a dynamic route with a static export
basically a next export will generate a file "[slug].html"
so you need to rewrite your URL from "/blog/hello-world" to "/blog/[slug].html" if you want to keep dynamic routes
The alternative is to statically build each page directly, so you generate one HTML file per article instead of using a true "dynamic" route
let me know if it answers your qzuestion I may have misunderstood the issue here, you might want to add more context about how your pages are structured
PersianOP
That could be it, I will give that a try. Thanks for your answer <3