Next.js Discord

Discord Forum

It is possible to control script order in nextjs?

Unanswered
Bruno Jura Hound posted this in #help-forum
Open in Discord
Bruno Jura HoundOP
I have a layout component like below:
<html lang="en">
  <head>
    <Script src="./somecode.js" />
  </head>
  <body>{children}</body>
</html>


But NextJS adds it to the end of the BODY tag, I want this script to run before ANY script that i have, even nextjs's scripts. Any ideas how can I achieve that?

6 Replies

Bruno Jura HoundOP
As I can see you cannot do that 😦 In page router versions you could use _document and do whatever you want with your script tags, but now they are pretty much fixed
though you can also simply use lowercase normal <script> [though the async prop might be needed](https://react.dev/reference/react-dom/components/script#special-rendering-behavior)
@joulev `strategy="beforeInteractive"`
Bruno Jura HoundOP
thanks for the response! I have tried that but it didn't work as I expect. it firstly adds main chunk and routes

  <Script
    id="wow"
    strategy="beforeInteractive"
    dangerouslySetInnerHTML={{ __html }}
  />
joulev
oh you want the script to run before nextjs scripts as well... i doubt this is possible
Bruno Jura HoundOP
actually it runs before, nextjs scripts are async, soo i guess i can ignore their order
but it doesn't look right