Next.js Discord

Discord Forum

script tag in the head is not running in production

Unanswered
American Curl posted this in #help-forum
Open in Discord
Original message was deleted.

13 Replies

Original message was deleted
Alaska pollock
have you tried using nextjs' scrip tag?
American Curl
Hi, Yes I did.
<head>
        <Script
          id="set-theme"
          strategy="beforeInteractive"
          dangerouslySetInnerHTML={{
            __html: `
            const params = new URL(document.location).searchParams;
            console.log('head script is running', params);
            const theme = params.get("theme") ?? "light"
            document.documentElement.classList.add(theme)
            `
          }}
        ></Script>
...

but no chance 😦
it definitely has a script tag in the head when I load the page but the console is not logged
Actually I need to run this script at the very beginning because there's a need to receive a theme from query string, and set it into html tag before anything is visible on the screen
American Curl
Strange is.. I tried to add the script tag in the body as well, but it's still not running. I added on top of the body and bottom as well 🤔
American Curl
I found that if useSearchParams hook is used in child clinet component, the head script is not running 🤔
@American Curl I found that if `useSearchParams` hook is used in child clinet component, the head script is not running 🤔
joulev
useSearchParams will deopt the entire tree up to the nearest Suspense to go client side rendered
So add a Suspense to the component wrapping the component using useSearchParams
Also please don’t repost the same question in another post, I will remove that other post
You should edit the title and question in this post instead
American Curl
Thanks for the answer and I will keep the rule as well!