Next.js Discord

Discord Forum

Load ThirtParty JS not work as expected with <Script>

Unanswered
Sutherman posted this in #help-forum
Open in Discord
SuthermanOP
I've upgraded to recent nextJS version and saw the recommendation to import 3rd-Party scripts now via <Script> instead of putting it inside <Head>.
So I've changed from this: 
return (
    <>
      <Head >
        <script type="text/javascript" src={cdnJs} />
        <link rel="stylesheet" href={cdnCss} media="print"
              onLoad="this.media='all'; this.onload=null;" />
      </Head >
    </>
  )


to this: 
....
return (
    <>
      <Script src={cdnJs} beforeInteractive />
      <Head >
        <link rel="stylesheet" href={cdnCss} media="print"
              onLoad="this.media='all'; this.onload=null;" />
      </Head >
    </>
  )


But now the page doesn't work anymore. As the Script seems not to be ready as the page is ready.
I got this error now: 
Uncaught ReferenceError: initCookieConsent is not defined


initCookieConsent is inside the cdnJS that should be included.

So any hint, what the issue is?

1 Reply

riský
kinda answering your question, but if your using https://cdnjs.com/, then you should just import them normaly into react/nextjs instead of using import like that...