-
Notifications
You must be signed in to change notification settings - Fork 26.9k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
next/script <Script>
component doesn't render if inside next/head <Head>
component
#27498
Comments
@stefanprobst I had seen that the documentation says you no longer need to wrap scripts in head, but I did not interpret that meaning that you must not wrap the scripts in (Though as an aside, this does make me curious why |
I followed the trail back and see that this commit previously included a clearer caveat that one shouldn't use Script inside of Head, though again I think the documentation really should say "must not" and the tag should potentially throw or console.error rather than silently fail in this case. Agreed that PR 27257 will help here. |
I added a PR (above) restoring a warning in the docs about this gotcha. I think between that and the new lint rule, this issue could be closed without needing to change functionality of either component. |
Documentation to help future developers avoid #27498 ## Documentation / Examples - [X] Make sure the linting passes
…#27534) Documentation to help future developers avoid vercel#27498 ## Documentation / Examples - [X] Make sure the linting passes
This looks like a forgotten issue. I'll close it. |
This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you. |
What version of Next.js are you using?
11.0.1
What version of Node.js are you using?
14.17.0
What browser are you using?
Chrome
What operating system are you using?
MacOS
How are you deploying your application?
Netlify
Describe the Bug
I'm following the demands of
next lint
, attempting to upgrade all my previous<script async src=...>
components to theScript
component. I ran into an issue upgrading the Google Analytics tag: when using<Script>
analytics is not loaded into the page, but when using<script>
it is.Finally correlated this issue with the fact that the
<Script>
component was stuck alongside my<meta>
tags inside of a Next<Head>
component. Moving it outside of the<Head>
also fixed the issue.Expected Behavior
Expected behavior would be that
<Script>
would function anywhere that<script>
functions (except for_document
, since that caveat is noted in the docs). If it is inside the<Head>
, it should wind up loading the same as if it weren't.To Reproduce
My setup:
./src/SetupGoogleAnalytics.tsx
./pages/index.tsx
./pages/works.tsx
The text was updated successfully, but these errors were encountered: