Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Wrap useSearchParams in Suspense #98

Open
funnelfiasco opened this issue Sep 17, 2024 · 1 comment
Open

Wrap useSearchParams in Suspense #98

funnelfiasco opened this issue Sep 17, 2024 · 1 comment
Assignees
Labels
bug Something isn't working help wanted Extra attention is needed

Comments

@funnelfiasco
Copy link
Collaborator

Next 14 and later require useSearchParams to have a Suspense boundary. It's not a problem when running yarn dev, but to make a release with yarn run build, you get this error:

   Generating static pages (0/4)  [    ] ⨯ useSearchParams() should be wrapped in a suspense boundary at page "/". Read more: https://nextjs.org/docs/messages/missing-suspense-with-csr-bailout
    at a (/Users/bcotton/guacsec/guac-visualizer/.next/server/chunks/288.js:1:10576)
    at h (/Users/bcotton/guacsec/guac-visualizer/.next/server/chunks/288.js:1:22225)
    at /Users/bcotton/guacsec/guac-visualizer/.next/server/app/page.js:247:8556
    at lx (/Users/bcotton/guacsec/guac-visualizer/.next/server/app/page.js:247:9491)
    at nM (/Users/bcotton/guacsec/guac-visualizer/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:47419)
    at nL (/Users/bcotton/guacsec/guac-visualizer/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:64674)
    at nI (/Users/bcotton/guacsec/guac-visualizer/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:46806)
    at nM (/Users/bcotton/guacsec/guac-visualizer/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:47570)
    at nM (/Users/bcotton/guacsec/guac-visualizer/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:61663)
    at nL (/Users/bcotton/guacsec/guac-visualizer/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:64674)

Error occurred prerendering page "/". Read more: https://nextjs.org/docs/messages/prerender-error

 ✓ Generating static pages (4/4) 

> Export encountered errors on following paths:
	/page: /
error Command failed with exit code 1.

In Next 14, you can disable this check, which I'll do for now because it seems to work. But Next 15 and higher will not support disabling it, so it's something we'll want to fix eventually.

It appears the only place that useSearchParams is called is in hooks/useGraphData.ts (in the eponymous function). That function only gets called in app/page.tsx. I tried guessing at a few places to put <Suspense> tags, but none of them eliminated the error.

funnelfiasco added a commit to funnelfiasco/guac-visualizer that referenced this issue Sep 17, 2024
This allows the project to build, but it is not a long-term fix, as the option
won't be available in Next 15 (we're using 14). See issue guacsec#98 for more details.

Signed-off-by: Ben Cotton <[email protected]>
@funnelfiasco funnelfiasco added bug Something isn't working help wanted Extra attention is needed labels Sep 17, 2024
mihaimaruseac pushed a commit that referenced this issue Sep 18, 2024
* Escape apostrophes

This makes the linter happy

Partially addresses #97

Signed-off-by: Ben Cotton <[email protected]>

* Disable the missingSuspenseWithCSRBailout option

This allows the project to build, but it is not a long-term fix, as the option
won't be available in Next 15 (we're using 14). See issue #98 for more details.

Signed-off-by: Ben Cotton <[email protected]>

---------

Signed-off-by: Ben Cotton <[email protected]>
@staticGuru
Copy link

I’m interested in taking on these issues. Could you please assign them to me? I would be happy to work on them.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working help wanted Extra attention is needed
Projects
None yet
Development

No branches or pull requests

2 participants