You may be experiencing the following error when running npm run build in your Next.js project, even when npm run dev works just fine:

Error: Export encountered errors on following paths: /posts/[slug]

Although this error message is rather general, you may encounter it after updating fallback: true in one of your pages.

To fix the error, simply add the following to the default export function of the page:

// pages/posts/[slug].js
import { useRouter } from 'next/router'

function Post({ post }) {
  const router = useRouter()

  // If the page is not yet generated, this will be displayed
  // initially until getStaticProps() finishes running
  if (router.isFallback) {
    return <div>Loading...</div>
  }

  // Render post...
}

Next.js generates the fallback page by generating a version of your page with no props. Therefore, there must be a code path that does not reference the props at all, or you will receive the error. The useRouter isFallback property is a good way to check if Next.js is generating the fallback page. With this, you can get creative about how your fallback page will appear.

(As of September 2021, this feature is primarily supported on the Vercel hosting platform. There was a discussion for implementation in the serverless-nextjs project and it may now be implemented outside a Vercel environment. See https://github.com/serverless-nextjs/serverless-next.js/issues/804 for more information.)

fallback: true and revalidate are often used in conjunction to achieve ISR (incremental static regeneration) mode.

The typical use case goes like this – there is a static page "List of Links" which links to some posts. New posts added at the data source/API/headless CMS won't necessarily be visible on the List of Links right away since it is a static page generated at build time. But, with revalidate: 60 set in the getStaticProps hook in list-of-links.js, the first request every 60 seconds will rebuild the static page if newer data exists. However, only List of Links will be rebuilt, not the whole project, so the new link will reference a static page post that doesn't exist yet. With fallback: true enabled, requests to the new post will be directed to our fallback page instead of a 404 error page. This fallback page will be displayed for a short time while Next.js builds the static production version of the new post and then swaps it out in real time.

You can also apply revalidate to the posts themselves so after they are edited their static pages will eventually be updated as well.

In development mode, fallback: true has no effect since each requests generates a dynamically rendered page. Static pages and the fallback page are only generated in a production build.

To read more about ISR check out of the official Next.js docs on the topic: https://nextjs.org/docs/basic-features/data-fetching#incremental-static-regeneration

Hope this helps! I think the error message thrown during the build process could have given us more of a hint ;)