vike 0.4.247 → 0.4.248

package/dist/server/runtime/renderPageServer/headersResponse.js

@@ -0,0 +1,46 @@
+export { resolveHeadersResponseEarly };
+export { resolveHeadersResponseFinal };
+import { addCspResponseHeader } from './csp.js';
+import { isCallable } from '../../utils.js';
+import { cacheControlDisable, getCacheControl } from './getCacheControl.js';
+function resolveHeadersResponseFinal(pageContext, statusCode) {
+    const headersResponse = pageContext.headersResponse || new Headers();
+    // 5xx error pages are temporary and shouldn't be cached.
+    // This overrides any previously set Cache-Control value.
+    if (statusCode >= 500)
+        headersResponse.set('Cache-Control', cacheControlDisable);
+    const headers = [];
+    headersResponse.forEach((value, key) => {
+        headers.push([key, value]);
+    });
+    return headers;
+}
+async function resolveHeadersResponseEarly(pageContext) {
+    const headersResponse = await resolveHeadersResponseConfig(pageContext);
+    if (!headersResponse.get('Cache-Control')) {
+        const cacheControl = getCacheControl(pageContext.pageId, pageContext._globalContext._pageConfigs);
+        if (cacheControl)
+            headersResponse.set('Cache-Control', cacheControl);
+    }
+    addCspResponseHeader(pageContext, headersResponse);
+    const pageContextAddendum = {
+        headersResponse,
+    };
+    return pageContextAddendum;
+}
+async function resolveHeadersResponseConfig(pageContext) {
+    const headersMerged = new Headers();
+    await Promise.all((pageContext.config.headersResponse ?? []).map(async (headers) => {
+        let headersInit;
+        if (isCallable(headers)) {
+            headersInit = await headers(pageContext);
+        }
+        else {
+            headersInit = headers;
+        }
+        new Headers(headersInit).forEach((value, key) => {
+            headersMerged.append(key, value);
+        });
+    }));
+    return headersMerged;
+}

package/dist/server/runtime/renderPageServer/html/injectAssets/getHtmlTags.js

@@ -0,0 +1,264 @@
+export { getHtmlTags };
+import { assert, assertWarning, assertUsage, isObject, freezePartial } from '../../../../utils.js';
+import { getGlobalContextClientSerialized, getPageContextClientSerialized, } from '../serializeContext.js';
+import { sanitizeJson } from './sanitizeJson.js';
+import { inferAssetTag, inferPreloadTag } from './inferHtmlTags.js';
+import { mergeScriptTags } from './mergeScriptTags.js';
+import { getPageConfig } from '../../../../../shared-server-client/page-configs/helpers.js';
+import { getConfigValueRuntime } from '../../../../../shared-server-client/page-configs/getConfigValueRuntime.js';
+import pc from '@brillout/picocolors';
+import { getConfigDefinedAt } from '../../../../../shared-server-client/page-configs/getConfigDefinedAt.js';
+import { htmlElementId_globalContext, htmlElementId_pageContext, } from '../../../../../shared-server-client/htmlElementIds.js';
+import { isFontFallback } from '../../isFontFallback.js';
+import { inferNonceAttr } from '../../csp.js';
+const stamp = '__injectFilterEntry';
+async function getHtmlTags(pageContext, streamFromReactStreamingPackage, injectFilter, pageAssets, viteDevScript, isStream) {
+    assert([true, false].includes(pageContext._isHtmlOnly));
+    const isHtmlOnly = pageContext._isHtmlOnly;
+    const { _isProduction: isProduction } = pageContext._globalContext;
+    const injectScriptsAt = getInjectScriptsAt(pageContext.pageId, pageContext._globalContext._pageConfigs);
+    const injectFilterEntries = [];
+    pageAssets
+        .filter((asset) => {
+        if (asset.isEntry && asset.assetType === 'script') {
+            // We could allow the user to change the position of <script> but we currently don't:
+            //  - Because of mergeScriptEntries()
+            //  - We would need to add HTML_STREAM to to PreloadFilterInject
+            // To support this, we should add the JavaScript entry to injectFilterEntries (with an `src` value of `null`)
+            return false;
+        }
+        return true;
+    })
+        .forEach((asset) => {
+        const inject = (() => {
+            if (!isProduction) {
+                // In development, we should always load assets as soon as possible, in order to eagerly process assets (e.g. applying the transform() hooks of Vite plugins) which are lazily discovered.
+                return 'HTML_BEGIN';
+            }
+            if (asset.assetType === 'style') {
+                return 'HTML_BEGIN';
+            }
+            if (asset.assetType === 'font') {
+                return !isFontFallback(asset, injectFilterEntries) ? 'HTML_BEGIN' : false;
+            }
+            if (asset.assetType === 'script') {
+                if (isHtmlOnly)
+                    return false;
+                return 'HTML_END';
+            }
+            return false;
+        })();
+        const entry = {
+            ...asset,
+            inject,
+            // @ts-ignore
+            [stamp]: true,
+        };
+        injectFilterEntries.push(entry);
+    });
+    assertInjectFilterEntries(injectFilterEntries);
+    // ==============
+    // injectFilter()
+    // ==============
+    if (injectFilter && isProduction) {
+        Object.seal(injectFilterEntries); // `Object.seal()` instead of `Object.freeze()` to allow the user to `assets.sort()`
+        Object.values(injectFilterEntries).forEach((entry) => freezePartial(entry, { inject: (val) => val === false || val === 'HTML_BEGIN' || val === 'HTML_END' }));
+        // Call the user's injectFilter() hook https://vike.dev/injectFilter
+        const res = injectFilter(injectFilterEntries);
+        assertUsage(res === undefined, `injectFilter() should return ${pc.cyan('undefined')}, see https://vike.dev/injectFilter`);
+        assertInjectFilterUsage(injectFilterEntries);
+    }
+    const htmlTags = [];
+    // ==============
+    // Non-JavaScript
+    // ==============
+    injectFilterEntries
+        .filter((asset) => asset.assetType !== 'script' && asset.inject)
+        .forEach((asset) => {
+        if (!asset.inject)
+            return;
+        const htmlTag = asset.isEntry ? inferAssetTag(asset, pageContext) : inferPreloadTag(asset);
+        htmlTags.push({ htmlTag, position: asset.inject });
+    });
+    // ==========
+    // JavaScript
+    // ==========
+    // - By default, we place the entry <script> towards the end of the HTML for better performance.
+    //   - Performance-wise, it's more interesting to start showing the page (parse HTML and load CSS) before starting loading scripts.
+    //   - But with HTML streaming, in order to support [Progressive Rendering](https://vike.dev/streaming#progressive-rendering), the entry <script> should be injected earlier instead.
+    // - The entry <script> shouldn't be `<script defer>` upon HTML streaming, otherwise progressive hydration while SSR streaming won't work.
+    // - `<script id="vike_pageContext" type="application/json">` (the `pageContext` JSON) should be fully sent before Vike's client runtime starts executing.
+    //   - Otherwise, race condition "SyntaxError: Unterminated string in JSON": https://github.com/vikejs/vike/issues/567
+    //   - `<script id="vike_pageContext" type="application/json">` must appear before the entry <script> (which loads Vike's client runtime).
+    //   - `<script id="vike_pageContext" type="application/json">` can't be async nor defer.
+    const positionJavaScriptDefault = 'HTML_END';
+    const positionJavaScriptEntry = (() => {
+        if (injectScriptsAt !== null) {
+            if (pageContext._pageContextPromise) {
+                assertWarning(injectScriptsAt === 'HTML_END' || !isStream, `You're setting injectScriptsAt to ${pc.code(JSON.stringify(injectScriptsAt))} while using HTML streaming with a pageContext promise (https://vike.dev/streaming#initial-data-after-stream-end) which is contradictory: the pageContext promise is skipped.`, { onlyOnce: true });
+            }
+            if (injectScriptsAt === 'HTML_STREAM' && !isStream) {
+                return positionJavaScriptDefault;
+            }
+            return injectScriptsAt;
+        }
+        if (pageContext._pageContextPromise) {
+            // - If there is a pageContext._pageContextPromise then <script id="vike_pageContext" type="application/json"> needs to await for it.
+            // - pageContext._pageContextPromise is typically resolved only after the page's components are rendered and the stream ended.
+            // - https://vike.dev/streaming#initial-data-after-stream-end
+            return positionJavaScriptDefault;
+        }
+        if (streamFromReactStreamingPackage && !streamFromReactStreamingPackage.hasStreamEnded()) {
+            // If there is a stream then, in order to support progressive hydration, inject the JavaScript during the stream after React(/Vue/Solid/...) resolved the first suspense boundary.
+            return 'HTML_STREAM';
+        }
+        return positionJavaScriptDefault;
+    })();
+    if (pageContext._pageContextPromise && streamFromReactStreamingPackage) {
+        // - Should we show this warning for Solid as well? Solid seems to also support progressive rendering.
+        //   - https://github.com/vikejs/vike-solid/issues/95
+        // - Vue doesn't seem to support progressive rendering yet.
+        //   - https://github.com/vikejs/vike-vue/issues/85
+        assertWarning(false, "We recommend against using HTML streaming and a pageContext promise (https://vike.dev/streaming#initial-data-after-stream-end) at the same time, because progressive hydration (https://vike.dev/streaming#progressive-rendering) won't work.", { onlyOnce: true });
+    }
+    if (!isHtmlOnly) {
+        // <script id="vike_pageContext" type="application/json">
+        htmlTags.push({
+            htmlTag: () => 
+            // Needs to be called after resolvePageContextPromise()
+            getPageContextJsonScriptTag(pageContext),
+            position: positionJavaScriptEntry,
+        });
+        // <script id="vike_globalContext" type="application/json">
+        htmlTags.push({
+            htmlTag: () => 
+            // Needs to be called after resolvePageContextPromise()
+            getGlobalContextJsonScriptTag(pageContext),
+            position: positionJavaScriptEntry,
+        });
+    }
+    // The JavaScript entry <script> tag
+    const scriptEntry = mergeScriptEntries(pageAssets, viteDevScript, pageContext);
+    if (scriptEntry) {
+        htmlTags.push({
+            htmlTag: scriptEntry,
+            position: positionJavaScriptEntry,
+        });
+    }
+    // Preload tags
+    injectFilterEntries
+        .filter((asset) => asset.assetType === 'script')
+        .forEach((asset) => {
+        assert(!asset.isEntry); // Users cannot re-order JavaScript entries, see creation of injectFilterEntries
+        const htmlTag = inferPreloadTag(asset);
+        if (!asset.inject)
+            return;
+        // Ideally, instead of this conditional ternary operator, we should add HTML_STREAM to PreloadFilterInject
+        const position = asset.inject === 'HTML_END' ? positionJavaScriptEntry : asset.inject;
+        htmlTags.push({ htmlTag, position });
+    });
+    return htmlTags;
+}
+function mergeScriptEntries(pageAssets, viteDevScript, pageContext) {
+    const scriptEntries = pageAssets.filter((pageAsset) => pageAsset.isEntry && pageAsset.assetType === 'script');
+    let scriptEntry = `${viteDevScript}${scriptEntries.map((asset) => inferAssetTag(asset, pageContext)).join('')}`;
+    // We merge scripts to avoid the infamous HMR preamble error.
+    // - Infamous HMR preamble error:
+    //   ```browser-console
+    //   usePageContext.tsx:10 Uncaught (in promise) Error: @vitejs/plugin-react can't detect preamble. Something is wrong.
+    //       at usePageContext.tsx:10:10
+    //   ```
+    // - Note the following race condition. Maybe making the second script non-async ensures execution order?
+    //   ```html
+    //   <script type="module">console.log("I can be printed *after* the other log")</script>
+    //   <script src="entry.js" type="module" async></script>
+    //   ```
+    //   ```js
+    //   // entry.js
+    //   console.log("I can be printed *before* the other log")
+    //   ```
+    // - Maybe an alternative would be to make Vike's client runtime entry <script> tag non-async. Would that work? Would it be a performance issue?
+    //   - The entry <script> shouldn't be `<script defer>` upon HTML streaming, otherwise progressive hydration while SSR streaming won't work.
+    scriptEntry = mergeScriptTags(scriptEntry, pageContext);
+    return scriptEntry;
+}
+function getPageContextJsonScriptTag(pageContext) {
+    const pageContextClientSerialized = sanitizeJson(getPageContextClientSerialized(pageContext, true));
+    const nonceAttr = inferNonceAttr(pageContext);
+    const htmlTag = `<script id="${htmlElementId_pageContext}" type="application/json"${nonceAttr}>${pageContextClientSerialized}</script>`;
+    // Used by contra.com https://github.com/gajus
+    // @ts-expect-error
+    pageContext._pageContextHtmlTag = htmlTag;
+    return htmlTag;
+}
+function getGlobalContextJsonScriptTag(pageContext) {
+    const globalContextClientSerialized = sanitizeJson(getGlobalContextClientSerialized(pageContext, true));
+    const nonceAttr = inferNonceAttr(pageContext);
+    const htmlTag = `<script id="${htmlElementId_globalContext}" type="application/json"${nonceAttr}>${globalContextClientSerialized}</script>`;
+    return htmlTag;
+}
+function assertInjectFilterEntries(injectFilterEntries) {
+    try {
+        checkForWrongUsage(injectFilterEntries);
+    }
+    catch (err) {
+        if (err?.message.includes('[Wrong Usage]')) {
+            assert(false);
+        }
+        throw err;
+    }
+}
+function assertInjectFilterUsage(injectFilterEntries) {
+    checkForWrongUsage(injectFilterEntries);
+    checkForWarnings(injectFilterEntries);
+}
+function checkForWrongUsage(injectFilterEntries) {
+    injectFilterEntries.forEach((entry, i) => {
+        assertUsage(isObject(entry), `[injectFilter()] Entry ${i} isn't an object`);
+        assertUsage(typeof entry.src === 'string', `[injectFilter()] Entry ${i} is missing property ${pc.cyan('src')}`);
+        assertUsage(entry[stamp] === true, `[injectFilter()] Entry ${i} (${entry.src}) isn't the original object, see https://vike.dev/injectFilter`);
+        assert([false, 'HTML_BEGIN', 'HTML_END'].includes(entry.inject));
+        assert(entry.assetType === null || typeof entry.assetType === 'string');
+        assert(entry.mediaType === null || typeof entry.mediaType === 'string');
+        assert(typeof entry.isEntry === 'boolean');
+        assert(Object.keys(entry).length === 6);
+    });
+}
+function checkForWarnings(injectFilterEntries) {
+    injectFilterEntries.forEach((a) => {
+        /*
+        if (a.assetType === 'script' && a.isEntry) {
+          assertUsage(a.inject, `[injectFilter()] ${a.src} needs to be injected`)
+        }
+        */
+        if (a.assetType === 'style' && a.isEntry) {
+            // In development, Vite automatically inject styles, but we still inject `<link rel="stylesheet" type="text/css" href="${src}">` tags in order to avoid FOUC (flash of unstyled content).
+            //  - https://github.com/vitejs/vite/issues/2282
+            //  - https://github.com/vikejs/vike/issues/261
+            assertWarning(a.inject, `[injectFilter()] We recommend against not injecting ${a.src}`, {
+                onlyOnce: true,
+            });
+        }
+        if (a.assetType === 'script') {
+            assertWarning(a.inject, `[injectFilter()] We recommend against not preloading JavaScript (${a.src})`, {
+                onlyOnce: true,
+            });
+        }
+    });
+}
+function getInjectScriptsAt(pageId, pageConfigs) {
+    if (pageConfigs.length === 0)
+        return null; // only support V1 design
+    const pageConfig = getPageConfig(pageId, pageConfigs);
+    const configValue = getConfigValueRuntime(pageConfig, 'injectScriptsAt');
+    if (!configValue)
+        return null;
+    const injectScriptsAt = configValue.value;
+    assert(configValue.definedAtData);
+    const configDefinedAt = getConfigDefinedAt('Config', 'injectScriptsAt', configValue.definedAtData);
+    assertUsage(injectScriptsAt === null ||
+        injectScriptsAt === 'HTML_BEGIN' ||
+        injectScriptsAt === 'HTML_END' ||
+        injectScriptsAt === 'HTML_STREAM', `${configDefinedAt} has an invalid value`);
+    return injectScriptsAt;
+}

package/dist/server/runtime/renderPageServer/html/injectAssets/getViteDevScript.js

@@ -0,0 +1,27 @@
+export { getViteDevScript };
+import { assert, assertUsage, assertWarning, getViteRPC } from '../../../../utils.js';
+import pc from '@brillout/picocolors';
+const reachOutCTA = 'Create a new GitHub issue to discuss a solution.';
+async function getViteDevScript(pageContext) {
+    const globalContext = pageContext._globalContext;
+    if (globalContext._isProduction) {
+        return '';
+    }
+    const { _viteDevServer: viteDevServer } = globalContext;
+    const fakeHtmlBegin = '<html> <head>'; // White space to test whether user is using a minifier
+    const fakeHtmlEnd = '</head><body></body></html>';
+    let fakeHtml = fakeHtmlBegin + fakeHtmlEnd;
+    fakeHtml = viteDevServer
+        ? await viteDevServer.transformIndexHtml('/', fakeHtml)
+        : await getViteRPC().transformIndexHtmlRPC(fakeHtml);
+    assertUsage(!fakeHtml.includes('vite-plugin-pwa'), `The HTML transformer of ${pc.cyan('vite-plugin-pwa')} cannot be applied, see workaround at https://github.com/vikejs/vike/issues/388#issuecomment-1199280084`);
+    assertUsage(!fakeHtml.startsWith(fakeHtmlBegin.replace(' ', '')), `Vite plugins that minify the HTML cannot be applied, see https://github.com/vikejs/vike/issues/224`);
+    assertUsage(fakeHtml.startsWith(fakeHtmlBegin) && fakeHtml.endsWith(fakeHtmlEnd), `You are using a Vite Plugin that transforms the HTML in a way that conflicts with Vike. ${reachOutCTA}`);
+    const viteInjection = fakeHtml.slice(fakeHtmlBegin.length, -1 * fakeHtmlEnd.length);
+    assert(viteInjection.includes('script'));
+    assertWarning(!viteInjection.includes('import('), `Unexpected Vite injected HMR code. ${reachOutCTA}`, {
+        onlyOnce: true,
+    });
+    const viteDevScript = viteInjection;
+    return viteDevScript;
+}

package/dist/server/runtime/renderPageServer/html/injectAssets/inferHtmlTags.js

@@ -0,0 +1,52 @@
+export { inferAssetTag };
+export { inferPreloadTag };
+export { inferEarlyHintLink };
+export { scriptCommonAttrs };
+import { assert } from '../../../../utils.js';
+import { inferNonceAttr } from '../../csp.js';
+// We can't use `defer` here. With `defer`, the entry script won't start before `</body>` has been parsed, preventing progressive hydration during SSR streaming, see https://github.com/vikejs/vike/pull/1271
+const scriptCommonAttrs = 'type="module" async';
+function inferPreloadTag(pageAsset) {
+    const { src, assetType, mediaType } = pageAsset;
+    const rel = getRel(pageAsset);
+    const attributes = [
+        `rel="${rel}"`,
+        `href="${src}"`,
+        !assetType ? null : `as="${assetType}"`,
+        !mediaType ? null : `type="${mediaType}"`,
+        // `crossorigin` is needed for fonts, see https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types/preload#cors-enabled_fetches
+        !isCrossOrigin(pageAsset) ? null : 'crossorigin',
+    ]
+        .filter(Boolean)
+        .join(' ');
+    return `<link ${attributes}>`;
+}
+function inferAssetTag(pageAsset, pageContext) {
+    const { src, assetType, mediaType } = pageAsset;
+    if (assetType === 'script') {
+        assert(mediaType === 'text/javascript');
+        const nonceAttr = inferNonceAttr(pageContext);
+        return `<script src="${src}" ${scriptCommonAttrs}${nonceAttr}></script>`;
+    }
+    if (assetType === 'style') {
+        // WARNING: if changing following line, then also update https://github.com/vikejs/vike/blob/fae90a15d88e5e87ca9fcbb54cf2dc8773d2f229/vike/client/shared/removeFoucBuster.ts#L29
+        return `<link rel="stylesheet" type="text/css" href="${src}">`;
+    }
+    assert(false, { pageAsset });
+}
+// We ignore crossorigin, it seems like Early Hints doesn't have a "crossorigin" property: https://github.com/vikejs/vike/issues/618#issuecomment-1415752222
+function inferEarlyHintLink(pageAsset) {
+    const { src, assetType } = pageAsset;
+    const rel = getRel(pageAsset);
+    return [`<${src}>`, `rel=${rel}`, !assetType ? null : `as=${assetType}`].filter(Boolean).join('; ');
+}
+function getRel({ assetType }) {
+    if (assetType === 'script') {
+        // Vite transpiles all browser-side JavaScript to ESM
+        return 'modulepreload';
+    }
+    return 'preload';
+}
+function isCrossOrigin({ src, assetType }) {
+    return assetType === 'font' || src.startsWith('http://') || src.startsWith('https://');
+}

package/dist/server/runtime/renderPageServer/html/injectAssets/injectAssets__public.js

@@ -0,0 +1,29 @@
+export { injectAssets__public };
+import { assertUsage, assertWarning, castProp, hasProp } from '../../../../utils.js';
+import { injectHtmlTagsToString } from '../injectAssets.js';
+// TO-DO/next-major-release: remove
+async function injectAssets__public(htmlString, pageContext) {
+    assertWarning(false, '`_injectAssets()` is deprecated and will be removed.', { onlyOnce: true, showStackTrace: true });
+    assertUsage(typeof htmlString === 'string', '[injectAssets(htmlString, pageContext)]: Argument `htmlString` should be a string.', { showStackTrace: true });
+    assertUsage(pageContext, '[injectAssets(htmlString, pageContext)]: Argument `pageContext` is missing.', {
+        showStackTrace: true,
+    });
+    const errMsg = (body) => '[injectAssets(htmlString, pageContext)]: ' +
+        body +
+        '. Make sure that `pageContext` is the object that Vike provided to your `render(pageContext)` hook.';
+    assertUsage(hasProp(pageContext, 'urlPathname', 'string'), errMsg('`pageContext.urlPathname` should be a string'), {
+        showStackTrace: true,
+    });
+    assertUsage(hasProp(pageContext, 'pageId', 'string'), errMsg('`pageContext.pageId` should be a string'), {
+        showStackTrace: true,
+    });
+    assertUsage(hasProp(pageContext, '__getPageAssets'), errMsg('`pageContext.__getPageAssets` is missing'), {
+        showStackTrace: true,
+    });
+    assertUsage(hasProp(pageContext, '_passToClient', 'string[]'), errMsg('`pageContext._passToClient` is missing'), {
+        showStackTrace: true,
+    });
+    castProp(pageContext, '__getPageAssets');
+    htmlString = await injectHtmlTagsToString([htmlString], pageContext, null);
+    return htmlString;
+}

package/dist/server/runtime/renderPageServer/html/injectAssets/injectHtmlTags.js

@@ -0,0 +1,160 @@
+// Unit tests at ./injectHtmlTags.spec.ts
+export { injectHtmlTags };
+export { injectHtmlTagsUsingStream };
+export { createHtmlHeadIfMissing };
+export { joinHtmlTags };
+// Only needed for unit tests
+export { injectAtOpeningTag };
+export { injectAtClosingTag };
+import { assert, assertUsage, slice } from '../../../../utils.js';
+function injectHtmlTags(htmlString, htmlTags, position) {
+    const htmlFragment = joinHtmlTags(htmlTags.filter((h) => h.position === position));
+    if (htmlFragment) {
+        htmlString = injectHtmlFragment(position, htmlFragment, htmlString);
+    }
+    return htmlString;
+}
+// Is it worth it? Should we remove this? https://github.com/vikejs/vike/pull/1740#issuecomment-2230540892
+function injectHtmlTagsUsingStream(htmlTags, streamFromReactStreamingPackage) {
+    const htmlFragment = joinHtmlTags(htmlTags.filter((h) => h.position === 'HTML_STREAM'));
+    if (htmlFragment) {
+        assert(!streamFromReactStreamingPackage.hasStreamEnded());
+        streamFromReactStreamingPackage.injectToStream(htmlFragment, { flush: true });
+    }
+}
+function joinHtmlTags(htmlTags) {
+    const htmlFragment = htmlTags.map((h) => resolveHtmlTag(h.htmlTag)).join('');
+    return htmlFragment;
+}
+function injectHtmlFragment(position, htmlFragment, htmlString) {
+    if (position === 'HTML_BEGIN') {
+        {
+            const res = injectAtPlaceholder(htmlFragment, htmlString, true);
+            if (res)
+                return res;
+        }
+        assert(tagOpeningExists('head', htmlString));
+        htmlString = injectAtOpeningTag('head', htmlString, htmlFragment);
+        return htmlString;
+    }
+    if (position === 'HTML_END') {
+        {
+            const res = injectAtPlaceholder(htmlFragment, htmlString, false);
+            if (res)
+                return res;
+        }
+        if (tagClosingExists('body', htmlString)) {
+            return injectAtClosingTag('body', htmlString, htmlFragment);
+        }
+        if (tagClosingExists('html', htmlString)) {
+            return injectAtClosingTag('html', htmlString, htmlFragment);
+        }
+        return htmlString + '\n' + htmlFragment;
+    }
+    assert(false);
+}
+function resolveHtmlTag(htmlTag) {
+    return typeof htmlTag !== 'string' ? htmlTag() : htmlTag;
+}
+function injectAtOpeningTag(tag, htmlString, htmlFragment) {
+    const openingTag = getTagOpening(tag);
+    const matches = htmlString.match(openingTag);
+    assert(matches && matches.length >= 1);
+    const tagInstance = matches[0];
+    assert(tagInstance);
+    const htmlParts = htmlString.split(tagInstance);
+    assert(htmlParts.length >= 2);
+    // Insert `htmlFragment` after first `tagInstance`
+    const before = slice(htmlParts, 0, 1)[0] + tagInstance;
+    const after = slice(htmlParts, 1, 0).join(tagInstance);
+    htmlFragment = injectBreakLines(htmlFragment, before, after);
+    return before + htmlFragment + after;
+}
+function injectAtClosingTag(tag, htmlString, htmlFragment) {
+    const tagClosing = getTagClosing(tag);
+    const matches = htmlString.match(tagClosing);
+    assert(matches && matches.length >= 1);
+    const tagInstance = matches[0];
+    assert(tagInstance);
+    const htmlParts = htmlString.split(tagInstance);
+    assert(htmlParts.length >= 2);
+    // Insert `htmlFragment` before last `tagClosing`
+    const before = slice(htmlParts, 0, -1).join(tagInstance);
+    const after = tagInstance + slice(htmlParts, -1, 0);
+    htmlFragment = injectBreakLines(htmlFragment, before, after);
+    return before + htmlFragment + after;
+}
+function injectBreakLines(htmlFragment, before, after) {
+    assert(htmlFragment.trim() === htmlFragment);
+    const currentLineBefore = before.split('\n').slice(-1)[0];
+    let paddingParent = currentLineBefore.match(/\s*$/)[0];
+    let isBlankLine = !!paddingParent;
+    if (!paddingParent) {
+        paddingParent = currentLineBefore.match(/^\s*/)[0];
+    }
+    if (!paddingParent)
+        return htmlFragment;
+    const whitespaceExtra = paddingParent ? '  ' : '';
+    const whitespace = `${paddingParent}${whitespaceExtra}`;
+    const padding = `\n${whitespace}`;
+    htmlFragment = htmlFragment.replace(/<[^\/]/g, (match) => `${padding}${match}`);
+    if (isBlankLine) {
+        assert(htmlFragment.startsWith(padding), { htmlFragment });
+        htmlFragment = whitespaceExtra + htmlFragment.slice(padding.length);
+    }
+    const currentLineAfter = after.split('\n')[0];
+    if (currentLineAfter.trim().length > 0) {
+        htmlFragment += '\n' + paddingParent;
+    }
+    return htmlFragment;
+}
+function createHtmlHeadIfMissing(htmlString) {
+    const assertion = () => assert(tagOpeningExists('head', htmlString) && tagClosingExists('head', htmlString));
+    if (tagOpeningExists('head', htmlString) && tagClosingExists('head', htmlString)) {
+        assertion();
+        return htmlString;
+    }
+    const htmlFragment = '<head></head>';
+    if (tagOpeningExists('html', htmlString)) {
+        htmlString = injectAtOpeningTag('html', htmlString, htmlFragment);
+        assertion();
+        return htmlString;
+    }
+    if (tagOpeningExists('!doctype', htmlString)) {
+        htmlString = injectAtOpeningTag('!doctype', htmlString, htmlFragment);
+        assertion();
+        return htmlString;
+    }
+    htmlString = htmlFragment + '\n' + htmlString;
+    assertion();
+    return htmlString;
+}
+// Pay attention to performance when searching for tags
+// Use the most effective way to test or match tag existence
+// Use tag existence checking with caution as it is costly operation
+function tagOpeningExists(tag, htmlString) {
+    const tagOpeningRE = getTagOpening(tag);
+    return tagOpeningRE.test(htmlString);
+}
+function tagClosingExists(tag, htmlString) {
+    const tagClosingRE = getTagClosing(tag);
+    return tagClosingRE.test(htmlString);
+}
+function getTagOpening(tag) {
+    const tagOpening = new RegExp(`<${tag}(>| [^>]*>)`, 'i');
+    return tagOpening;
+}
+function getTagClosing(tag) {
+    const tagClosing = new RegExp(`</${tag}>`, 'i');
+    return tagClosing;
+}
+function injectAtPlaceholder(htmlFragment, htmlString, isFirst) {
+    // TO-DO/eventually: soft deprecate in favor of https://github.com/vikejs/vike/issues/695
+    // Used by BurdaForward https://github.com/vikejs/vike/discussions/2528#discussioncomment-13637156
+    const placeholder = isFirst ? '__VITE_PLUGIN_SSR__ASSETS_FIRST__' : '__VITE_PLUGIN__SSR_ASSETS_LAST__';
+    const parts = htmlString.split(placeholder);
+    if (parts.length === 1)
+        return null;
+    assertUsage(parts.length === 2, "You're inserting assets twice into your HTML", { showStackTrace: true });
+    return [parts[0], htmlFragment, parts[1]].join('');
+}

package/dist/server/runtime/renderPageServer/html/injectAssets/mergeScriptTags.js

@@ -0,0 +1,71 @@
+export { mergeScriptTags };
+import { inferNonceAttr } from '../../csp.js';
+import { assert } from '../../../../utils.js';
+import { scriptCommonAttrs } from './inferHtmlTags.js';
+const scriptRE = /(<script\b(?:\s[^>]*>|>))(.*?)<\/script>/gims;
+const srcRE = /\bsrc\s*=\s*(?:"([^"]+)"|'([^']+)'|([^\s'">]+))/im;
+const typeRE = /\btype\s*=\s*(?:"([^"]+)"|'([^']+)'|([^\s'">]+))/im;
+function mergeScriptTags(scriptTagsHtml, pageContext) {
+    let scriptTag = '';
+    const scripts = parseScripts(scriptTagsHtml);
+    // We need to merge module scripts to ensure execution order
+    {
+        const scriptsModule = scripts.filter(({ isModule }) => isModule);
+        if (scriptsModule.length === 1) {
+            scriptTag += scriptsModule[0].outerHtml;
+        }
+        else {
+            const contents = [];
+            scriptsModule.forEach(({ src, innerHtml }) => {
+                const hasInnerHtml = !!innerHtml.trim();
+                if (src) {
+                    assert(!hasInnerHtml);
+                    // - We don't use a static import because static imports are hoisted => React's HMR preamble can be executed after user land code => triggering this error:
+                    //   ```
+                    //   [22:28:57.885][/test-dev.test.ts][pnpm run dev][Browser Error] Error: @vitejs/plugin-react-swc can't detect preamble. Something is wrong.
+                    //       at http://localhost:3000/@fs/home/rom/code/docpress/src/renderer/usePageContext.tsx:9:11
+                    //   ```
+                    // - We don't use `await` the dynamic import() to avoid waterfall
+                    contents.push(`import(${JSON.stringify(src)});`);
+                }
+                else if (hasInnerHtml) {
+                    innerHtml = innerHtml.split('\n').filter(Boolean).join('\n');
+                    contents.push(innerHtml);
+                }
+            });
+            if (contents.length > 0) {
+                const nonceAttr = inferNonceAttr(pageContext);
+                scriptTag += `<script ${scriptCommonAttrs}${nonceAttr}>\n${contents.join('\n')}\n</script>`;
+            }
+        }
+    }
+    // We don't need to merge ES5 scripts
+    {
+        const scriptsES5 = scripts.filter(({ isModule }) => !isModule);
+        scriptsES5.forEach(({ outerHtml }) => {
+            scriptTag += outerHtml;
+        });
+    }
+    return scriptTag;
+}
+function parseScripts(htmlString) {
+    const scripts = [];
+    let match;
+    while ((match = scriptRE.exec(htmlString))) {
+        const [outerHtml, openTag, innerHtml] = match;
+        assert(outerHtml && openTag && innerHtml !== undefined);
+        let isModule = false;
+        {
+            const typeMatch = openTag.match(typeRE);
+            const type = typeMatch && (typeMatch[1] || typeMatch[2] || typeMatch[3]);
+            isModule = type === 'module';
+        }
+        let src = null;
+        {
+            const srcMatch = openTag.match(srcRE);
+            src = (srcMatch && (srcMatch[1] || srcMatch[2] || srcMatch[3])) || '';
+        }
+        scripts.push({ isModule, src, innerHtml, outerHtml });
+    }
+    return scripts;
+}