How can I load an external <script> at an exact point of HTML?
Unanswered
American Wirehair posted this in #help-forum
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
- Use <Script strategy="beforeInteractive" defer={false}> with
What choices do I have left?
- 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 targetWhat choices do I have left?
2 Replies
Cape horse mackerel
Have you tried all script strategies?
beforeInteractive |Â afterInteractive |Â lazyLoad?or maybe smth like this?
<Script
id="show-banner"
dangerouslySetInnerHTML={{
__html: `document.getElementById('banner').classList.remove('hidden')`,
}}
/>