-
-
Notifications
You must be signed in to change notification settings - Fork 6.2k
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
inject <script type="module"> into <head> instead of <body> #881
Comments
Can you give a specific description for this? Why ssr result will no longer contain the scripts? |
Rough example just to demonstrate the point
index.html <body>
<script type="module" src="index.js"></script>
</body> If you run that index.html through a generic prerenderer, it turns into <body>
Hello
</body> Now the script is gone and so serving that to the client won't work |
|
I'm not sure i understand you correctly. In this scenario there is a single Is there a legitimate reason for Besides rewriting index.html before prerender there is another workaround for my usecase, but i really would like to not add this extra element. //...
const target = document.querySelector('#target');
target.innerHTML='Hello';
alert('world');
//... <body>
<div id="target" style="display: contents;"></div>
<script src="index.js"></script>
</body> which would then be prerendered as <body>
<div id="target" style="display: contents;">Hello</div>
<script src="index.js"></script>
</body> |
Good to know about this feature! |
@dominikg. I know your mean with issues :)
I think it should be better than put index.js into head.The brower will show the html before hydration, this is main reason of use ssr. Edit: The module script is execute after html parsed.So put module script into head is also worked fine. |
@sodatea The |
@underfin According to the spec link in the issue, According to the resource hints spec (w3c/resource-hints#13, https://www.w3.org/TR/preload/#early-fetch-and-application-defined-execution), if I understand correctly, |
See comment in #882 |
- injectPreload for entry chunk - move script injection back to end of body (reverts vitejs#882) - fix indentation of injectPreload, injectCSS and injectScript Fixes vitejs#1050, see also vitejs#881.
- injectPreload for entry chunk - move script injection back to end of body (reverts vitejs#882) - fix indentation of injectPreload, injectCSS and injectScript Fixes vitejs#1050, see also vitejs#881.
Is your feature request related to a problem? Please describe.
vite buildHtmlPlugin injects
<script type="module">
tags at the end of<body>
This has 2 potential issues with generic SSR (eg. headless chrome with puppeteer crawling a regular vite build)
Describe the solution you'd like
Inject module scripts in
<head>
they are only executed after parse per spec: https://html.spec.whatwg.org/multipage/scripting.html#attr-script-defer
Describe alternatives you've considered
rewrite index.html after vite is done, before SSR
Additional context
Ran into this when i tried to build a simple export feature in svite, where the svelte app is mounted to document.body by default. Not an issue when you don't use sveltes hydratable compiler option. But when you do, 2) above happens
The text was updated successfully, but these errors were encountered: