NextJS动态路径未预生成HTML，如何强制构建时用SSG而非ISR？

问题根源 #

你当前的getStaticPaths配置里设置了fallback: "blocking"，这就是页面不在构建阶段预生成HTML的关键原因。这个配置的作用是：如果访问的路径不在paths数组中定义，服务器会实时渲染该页面并缓存结果，表现出类似ISR的增量生成行为——哪怕你没在getStaticProps里设置revalidate。

解决方案 #

要强制所有页面在构建阶段完成SSG预生成，按以下步骤修改：

1. 修改fallback的值为false
   在getStaticPaths的返回对象里，把fallback: "blocking"改成fallback: false。这样Next.js会在构建时预生成paths数组中列出的所有路径，任何不在数组里的路径都会直接返回404，完全符合全预构建的需求。

   修改后的getStaticPaths代码：

   export const getStaticPaths: GetStaticPaths = async (context) => {
     const cmsPaths = await fetchCmsPaths()
     const locales = context.locales || []
   
     const paths = cmsPaths
       .filter((path) => path !== "/" && path !== "/404" && path !== "/500")
       .map((path) =>
         locales.map((locale) => ({
           params: { path: path.split("/").filter(Boolean) },
           locale,
         })),
       )
       .flat()
   
     return {
       paths,
       fallback: false, // 这里改成false
     }
   }
   

2. 确保fetchCmsPaths()返回全部需要的路径
   确认fetchCmsPaths()函数能从CMS拉取到所有需要预生成的页面路径。如果有路径遗漏，这些路径在访问时会返回404，所以要保证这个函数的逻辑能覆盖所有页面。

验证效果 #

修改完成后执行yarn build，再查看.next/server/pages目录，对应[...path].tsx匹配的所有页面都会生成对应的HTML文件，无需访问触发生成。

内容的提问来源于stack exchange，提问作者Angelo Dias