How to disable static page generation during Next.js site build

If your Next.js React TypeScript web application uses database calls to display data on the pages, and during build time the database is not available, we need to disable the static page generation, otherwise we get the following error:

info Generating static pages
…
TypeError: Failed to parse URL from …
…
code: ‘ERR_INVALID_URL’

To disable the static page generation during build, Add the getInitialProps function to the App object in the pages/_app.tsx file.

import '@/styles/globals.css'
import type { AppProps } from 'next/app'

export default function App({ Component, pageProps }: AppProps) {

  return <Component {...pageProps} />
}

App.getInitialProps = async ({}) => {
  return {  }
}