Next.js Discord

Discord Forum

`npm run build` failing on Suspense component

Unanswered
Tonkinese posted this in #help-forum
Open in Discord
TonkineseOP
Hey guys, any ideas why npm run build fails when I return this component inside my page? 
--- app/(foo)/page.tsx ---
const Page = () => {
  return <FooWrapper />
)

--- FooWrapper.tsx ---
export const FooWrapper = () => {
  return (
    <Suspense fallback={<FooSkeleton />}>
      <FooClient />
    </Suspense>
  );
};

If I remove the Suspense and replace it with a div (for example), the build works. I don't understand why

4 Replies

TonkineseOP
I'm guessing it's the Suspense that's causing the issue?
TonkineseOP
Should wrapping a client component in a Suspense component cause a build to fail?
TonkineseOP
what's an example of how a suspense + client component should look like in order for build to be able to work properly?
TonkineseOP
figured it out