getStaticPaths array.map 在部署到 Vercel 时不是 function

Question

Code is below, the dev server works perfectly fine without error, however when I try to deploy the site I get this error.

> Build error occurred
TypeError: artists.map is not a function
    at getStaticPaths (/vercel/path0/.next/server/pages/artists/[slug].js:106:24)
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
    at async buildStaticPaths (/vercel/path0/node_modules/next/dist/build/utils.js:498:31)
    at async /vercel/path0/node_modules/next/dist/build/utils.js:641:119
    at async Span.traceAsyncFn (/vercel/path0/node_modules/next/dist/trace/trace.js:74:20) {
  type: 'TypeError'
}

export async function getStaticProps({ params }) {
  const siteSettings = await fetcher("http://localhost:3000/api/settings");
  const artists = await fetcher(
    `${process.env.URL}/api/artists/${params.slug}`
  );
  const artist = artists.allArtist[0];

  return {    
    props: {    
      siteSettings,    
      artist,    
    },    
  };    
} 

export async function getStaticPaths() {    
  const artists = await fetch(`${process.env.URL}/api/artists`);    
     
  return {                                                                                                           
    paths: artists.map((artist) => {                                                                                 
      return {    
        params: {    
          slug: artist.slug.current,    
        },    
      };    
    }),    
    fallback: false,    
  };    
}    

How would I go about fixing this error, as I said it works perfectly fine in the dev server with no console logs containing any errors.

Any help would be greatly appreciated.

Answer 1

I attempted writing the API route logic directly in the getStaticProps function and this fixed the error @juliomalves also posted this link which suggests a similar answer: Fetch error when building Next.js static website in production

Thanks for the help.

Mac