Next.js Discord

Discord Forum

How can I load an external <script> at an exact point of HTML?

American Wirehair posted this in #help-forum
Open in Discord
American WirehairOP
I got an external <script src="example"> that has to be loaded exactly where the resulting embed should be. I can't manage to place it there though, I have tried the following:
- Regular <script> tag: hydration error
- Use <Script>: the script is not placed at the correct place
- Use <Script> with appendChild: the script uses document.write(), which won't work with asyncronous script
- Use <Script strategy="beforeInteractive" defer={false}> with appendChild: can't use appendChild since the script is loaded before the ID that I target

What choices do I have left?

2 Replies

Cape horse mackerel
Have you tried all script strategies?
beforeInteractive | afterInteractive | lazyLoad?
or maybe smth like this?
    __html: `document.getElementById('banner').classList.remove('hidden')`,