vike 0.4.148 → 0.4.149-commit-041ee42

package/dist/esm/node/plugin/plugins/devConfig/index.js

@@ -22,22 +22,33 @@ function devConfig() {
             config() {
                 return {
                     appType: 'custom',
+                    // TODO:v1-release: remove (AFAICT we only need to use config.optimizeDeps for the old design)
                     optimizeDeps: {
                         exclude: [
-                            // We exclude the vike client to be able to use `import.meta.glob()`
+                            // We exclude Vike's client runtime to be able to use Vite's import.meta.glob()
                             'vike/client',
                             'vike/client/router',
                             'vike/routing',
-                            // - We also exclude @brillout/json-serializer and @brillout/picocolors to avoid:
-                            //   ```
-                            //   9:28:58 AM [vite] ✨ new dependencies optimized: @brillout/json-serializer/parse
-                            //   9:28:58 AM [vite] ✨ optimized dependencies changed. reloading
-                            //   ```
-                            // - Previously, we had to exclude @brillout/json-serializer and @brillout/picocolors because of pnpm, but this doesn't seem to be the case anymore.
-                            //   - Actually, this should be still the case? How can Vite resolve @brillout/json-serializer when using pnpm?
+                            // We exclude @brillout/json-serializer and @brillout/picocolors to avoid:
+                            // ```
+                            // 9:28:58 AM [vite] ✨ new dependencies optimized: @brillout/json-serializer/parse
+                            // 9:28:58 AM [vite] ✨ optimized dependencies changed. reloading
+                            // ```
                             '@brillout/json-serializer/parse',
                             '@brillout/json-serializer/stringify',
-                            '@brillout/picocolors'
+                            '@brillout/picocolors',
+                            // We exclude all packages that depend on any optimizeDeps.exclude entry because, otherwise, the entry cannot be resolved when using pnpm. For example:
+                            // ```
+                            // Failed to resolve import "@brillout/json-serializer/parse" from "../../packages/vike-react-query/dist/renderer/VikeReactQueryWrapper.js". Does the file exist?
+                            // 343|  // ../../node_modules/.pnpm/react-streaming@0.3.16_react-dom@18.2.0_react@18.2.0/node_modules/react-streaming/dist/esm/client/useAsync.js
+                            // 344|  import { parse as parse2 } from "@brillout/json-serializer/parse";
+                            // ```
+                            // The source map is confusing, the import actually lives at node_modules/.vite/deps/vike-react-query_renderer_VikeReactQueryWrapper.js which contains:
+                            // ```js
+                            // // ../../node_modules/.pnpm/react-streaming@0.3.16_react-dom@18.2.0_react@18.2.0/node_modules/react-streaming/dist/esm/client/useAsync.js
+                            // import { parse as parse2 } from "@brillout/json-serializer/parse";
+                            // ```
+                            'react-streaming'
                         ]
                     }
                 };

package/dist/esm/node/plugin/plugins/importUserCode/v1-design/getVikeConfig/crawlPlusFiles.js

@@ -8,19 +8,24 @@ const execA = promisify(exec);
 async function crawlPlusFiles(userRootDir, outDirAbsoluteFilesystem, isDev) {
     assertPosixPath(userRootDir);
     assertPosixPath(outDirAbsoluteFilesystem);
+    // Vike prepends userRootDir without resolving, e.g. outDirRelativeFromUserRootDir can be /home/rom/my-monorepo/my-app/../my-build/dist/ while userRootDir is /home/rom/my-monorepo/my-app/
     assert(outDirAbsoluteFilesystem.startsWith(userRootDir));
-    const outDir = path.posix.relative(userRootDir, outDirAbsoluteFilesystem);
-    assert(!outDir.startsWith('.'));
+    let outDirRelativeFromUserRootDir = path.posix.relative(userRootDir, outDirAbsoluteFilesystem);
+    if (outDirRelativeFromUserRootDir.startsWith('../')) {
+        // config.outDir is outside of config.root => it's going to be ignored anyways
+        outDirRelativeFromUserRootDir = null;
+    }
+    assert(outDirRelativeFromUserRootDir === null || !outDirRelativeFromUserRootDir.startsWith('.'));
     const timeBase = new Date().getTime();
     let files = [];
-    const res = await gitLsFiles(userRootDir, outDir);
+    const res = await gitLsFiles(userRootDir, outDirRelativeFromUserRootDir);
     if (res &&
         // Fallback to fast-glob for users that dynamically generate plus files (we assume generetad plus files to be skipped because they are usually included in .gitignore)
         res.length > 0) {
         files = res;
     }
     else {
-        files = await fastGlob(userRootDir, outDir);
+        files = await fastGlob(userRootDir, outDirRelativeFromUserRootDir);
     }
     {
         const time = new Date().getTime() - timeBase;
@@ -44,46 +49,39 @@ async function crawlPlusFiles(userRootDir, outDirAbsoluteFilesystem, isDev) {
     return plusFiles;
 }
 // Same as fastGlob() but using `$ git ls-files`
-async function gitLsFiles(userRootDir, outDir) {
+async function gitLsFiles(userRootDir, outDirRelativeFromUserRootDir) {
+    if (!(await isUsingGit(userRootDir)))
+        return null;
     const cmd = [
         'git ls-files',
         ...scriptFileExtensionList.map((ext) => `"**/+*.${ext}"`),
-        ...getIgnorePatterns(outDir).map((pattern) => `--exclude="${pattern}"`),
+        ...getIgnorePatterns(outDirRelativeFromUserRootDir).map((pattern) => `--exclude="${pattern}"`),
         // --others lists untracked files only (but using .gitignore because --exclude-standard)
         // --cached adds the tracked files to the output
         '--others --cached --exclude-standard'
     ].join(' ');
-    let stdout;
-    try {
-        const res = await execA(cmd, { cwd: userRootDir });
-        stdout = res.stdout;
-    }
-    catch (err) {
-        if (err.message.includes('not a git repository'))
-            return null;
-        throw err;
-    }
-    let files = stdout.split('\n').filter(Boolean);
-    assert(!outDir.startsWith('/'));
+    let files = await runCmd(cmd, userRootDir);
     files = files.filter(
     // We have to repeat the same exclusion logic here because the `git ls-files` option --exclude only applies to untracked files. (We use --exclude only to speed up the command.)
-    (file) => getIgnoreFilter(file, outDir));
+    (file) => getIgnoreFilter(file, outDirRelativeFromUserRootDir));
+    // Remove tracked but deleted files
+    const filesIgnore = await runCmd('git ls-files --deleted', userRootDir);
+    files = files.filter((file) => !filesIgnore.includes(file));
     return files;
 }
 // Same as gitLsFiles() but using fast-glob
-async function fastGlob(userRootDir, outDir) {
+async function fastGlob(userRootDir, outDirRelativeFromUserRootDir) {
     const files = await glob(`**/+*.${scriptFileExtensions}`, {
-        ignore: getIgnorePatterns(outDir),
+        ignore: getIgnorePatterns(outDirRelativeFromUserRootDir),
         cwd: userRootDir,
         dot: false
     });
     return files;
 }
 // Same as getIgnoreFilter() but as glob pattern
-function getIgnorePatterns(outDir) {
-    return [
+function getIgnorePatterns(outDirRelativeFromUserRootDir) {
+    const ignorePatterns = [
         '**/node_modules/**',
-        `${outDir}/**`,
         // Allow:
         // ```
         // +Page.js
@@ -91,8 +89,36 @@ function getIgnorePatterns(outDir) {
         // ```
         '**/*.telefunc.*'
     ];
+    if (outDirRelativeFromUserRootDir) {
+        assert(!outDirRelativeFromUserRootDir.startsWith('/'));
+        ignorePatterns.push(`${outDirRelativeFromUserRootDir}/**`);
+    }
+    return ignorePatterns;
 }
 // Same as getIgnorePatterns() but for Array.filter()
-function getIgnoreFilter(file, outDir) {
-    return !file.includes('node_modules/') && !file.includes('.telefunc.') && !file.startsWith(`${outDir}/`);
+function getIgnoreFilter(file, outDirRelativeFromUserRootDir) {
+    assert(!file.startsWith('/'));
+    assert(outDirRelativeFromUserRootDir === null || !outDirRelativeFromUserRootDir.startsWith('/'));
+    return (!file.includes('node_modules/') &&
+        !file.includes('.telefunc.') &&
+        (!outDirRelativeFromUserRootDir || !file.startsWith(`${outDirRelativeFromUserRootDir}/`)));
+}
+// Whether Git is installed and whether userRootDir is inside a Git repository
+async function isUsingGit(userRootDir) {
+    let res;
+    try {
+        res = await execA('git rev-parse --is-inside-work-tree', { cwd: userRootDir });
+    }
+    catch {
+        return false;
+    }
+    const { stdout, stderr } = res;
+    assert(stderr.toString().trim() === '');
+    assert(stdout.toString().trim() === 'true');
+    return true;
+}
+async function runCmd(cmd, cwd) {
+    const res = await execA(cmd, { cwd });
+    assert(res.stderr === '');
+    return res.stdout.toString().trim().split('\n');
 }

package/dist/esm/node/runtime/html/injectAssets/getHtmlTags.d.ts

@@ -15,6 +15,10 @@ type InjectFilterEntry = {
     src: string;
     assetType: null | PageAsset['assetType'];
     mediaType: null | PageAsset['mediaType'];
+    /** Whether src is a root in the dependency graph.
+     *  - For JavaScript this means whether src is imported by a dynamic import() statement.
+     *  - All CSS files have `isEntry: true`
+     */
     isEntry: boolean;
     inject: PreloadFilterInject;
 };

package/dist/esm/node/runtime/html/injectAssets/getHtmlTags.js

@@ -7,39 +7,37 @@ import { getViteDevScripts } from './getViteDevScripts.js';
 import { mergeScriptTags } from './mergeScriptTags.js';
 import { getGlobalContext } from '../../globalContext.js';
 import pc from '@brillout/picocolors';
+const stamp = '__injectFilterEntry';
 async function getHtmlTags(pageContext, injectToStream, injectFilter) {
     assert([true, false].includes(pageContext._isHtmlOnly));
     const isHtmlOnly = pageContext._isHtmlOnly;
-    const globalContext = getGlobalContext();
-    const { isProduction } = globalContext;
-    const injectJavaScriptDuringStream = !pageContext._pageContextPromise && !!injectToStream;
+    const { isProduction } = getGlobalContext();
     const pageAssets = await pageContext.__getPageAssets();
-    const stamp = Symbol('injectFilterEntryStamp');
-    const getInject = (asset) => {
-        if (!isProduction) {
-            return 'HTML_BEGIN';
-        }
-        if (asset.assetType === 'style' || asset.assetType === 'font') {
-            return 'HTML_BEGIN';
-        }
-        if (asset.assetType === 'script') {
-            return 'HTML_END';
-        }
-        return false;
-    };
     const injectFilterEntries = pageAssets
         .filter((asset) => {
         if (asset.isEntry && asset.assetType === 'script') {
-            // We could in principle allow the user to change the position of <script> but we don't because of `getMergedScriptTag()`
-            return false;
-        }
-        if (isHtmlOnly && 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 STREAM to to PreloadFilterInject
+            // To suppor this, we should add the JavaScript entry to injectFilterEntries (with an `src` value of `null`)
             return false;
         }
         return true;
     })
         .map((asset) => {
-        const inject = getInject(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' || asset.assetType === 'font') {
+                return 'HTML_BEGIN';
+            }
+            if (asset.assetType === 'script') {
+                return 'HTML_END';
+            }
+            return false;
+        })();
         const entry = {
             ...asset,
             inject,
@@ -48,91 +46,103 @@ async function getHtmlTags(pageContext, injectToStream, injectFilter) {
         };
         return entry;
     });
-    assertInjectFilterEntries(injectFilterEntries, stamp);
+    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, 'Wrong injectFilter() usage, see https://vike.dev/injectFilter');
-        assertInjectFilterUsage(injectFilterEntries, stamp);
-        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 (!isHtmlOnly && a.assetType === 'script') {
-                assertWarning(a.inject, `[injectFilter()] We recommend against not preloading JavaScript (${a.src})`, {
-                    onlyOnce: true
-                });
-            }
-        });
+        assertUsage(res === undefined, `injectFilter() should return ${pc.cyan('undefined')}, see https://vike.dev/injectFilter`);
+        assertInjectFilterUsage(injectFilterEntries);
     }
     const htmlTags = [];
+    // ==============
     // Non-JavaScript
-    for (const asset of injectFilterEntries) {
-        if (asset.assetType !== 'script' && asset.inject) {
-            const htmlTag = asset.isEntry ? inferAssetTag(asset) : inferPreloadTag(asset);
-            htmlTags.push({ htmlTag, position: asset.inject });
-        }
-    }
+    // ==============
+    injectFilterEntries
+        .filter((asset) => asset.assetType !== 'script' && asset.inject)
+        .forEach((asset) => {
+        if (!asset.inject)
+            return;
+        const htmlTag = asset.isEntry ? inferAssetTag(asset) : inferPreloadTag(asset);
+        htmlTags.push({ htmlTag, position: asset.inject });
+    });
+    // ==========
     // JavaScript
-    const positionProd = injectJavaScriptDuringStream ? 'STREAM' : 'HTML_END';
-    const positionScript = !isProduction ? 'HTML_BEGIN' : positionProd;
-    const positionJsonData = !isProduction && !pageContext._pageContextPromise && !pageContext._isStream ? 'HTML_BEGIN' : positionProd;
-    const jsScript = await getMergedScriptTag(pageAssets, isProduction);
-    if (jsScript) {
+    // ==========
+    // In order to avoid the race-condition depicted in https://github.com/vikejs/vike/issues/567
+    // 1. <script id="vike_pageContext" type="application/json"> must appear before the entry <script> (which loads Vike's client runtime).
+    // 2. <script id="vike_pageContext" type="application/json"> can't be async nor defer.
+    // Additionally:
+    // 3. the entry <script> can't be defer, otherwise progressive hydration while SSR streaming won't work.
+    // 4. the entry <script> should be towards the end of the HTML as performance-wise it's more interesting to parse
+    //    <div id="page-view"> before running the entry <script> which initiates the hydration.
+    // See https://github.com/vikejs/vike/pull/1271
+    const positionJavaScriptEntry = (() => {
+        if (pageContext._pageContextPromise) {
+            assertWarning(!injectToStream, "[getHtmlTags()] We recommend against using streaming and a pageContext promise at the same time as partial hydration won't work", { onlyOnce: true });
+            // If there is a pageContext._pageContextPromise (which is resolved after the stream has ended) then the pageContext JSON data needs to await for it: https://vike.dev/stream#initial-data-after-stream-end
+            return 'HTML_END';
+        }
+        if (injectToStream) {
+            // If there is a stream then, in order to support partial hydration, inject the JavaScript during the stream after React(/Vue/Solid/...) resolved the first suspense boundary
+            return 'STREAM';
+        }
+        else {
+            return 'HTML_END';
+        }
+    })();
+    // <script id="vike_pageContext" type="application/json">
+    if (!isHtmlOnly) {
         htmlTags.push({
-            htmlTag: jsScript,
-            position: positionScript
+            htmlTag: () => 
+            // Needs to be called after resolvePageContextPromise()
+            getPageContextJsonScriptTag(pageContext),
+            position: positionJavaScriptEntry
         });
     }
-    for (const asset of injectFilterEntries) {
-        if (asset.assetType === 'script' && asset.inject) {
-            const htmlTag = asset.isEntry ? inferAssetTag(asset) : inferPreloadTag(asset);
-            const position = asset.inject === 'HTML_END' ? positionScript : asset.inject;
-            htmlTags.push({ htmlTag, position });
-        }
-    }
-    // `pageContext` JSON data
-    if (!isHtmlOnly) {
-        // Don't allow the user to manipulate with injectFilter(): injecting <script type="application/json"> before the stream can break the app when:
-        //  - using https://vike.dev/stream#initial-data-after-stream-end
-        //  - `pageContext` is modified during the stream, e.g. https://github.com/brillout/vike-with-pinia which uses https://vuejs.org/api/composition-api-lifecycle.html#onserverprefetch
-        // The <script> tags are handled separately by vike down below.
+    // The JavaScript entry <script> tag
+    const scriptEntry = await mergeScriptEntries(pageAssets, isProduction);
+    if (scriptEntry) {
         htmlTags.push({
-            // Needs to be called after `resolvePageContextPromise()`
-            htmlTag: () => getPageContextTag(pageContext),
-            position: positionJsonData
+            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 STREAM to PreloadFilterInject (or a better fitting name such as HTML_STREAM)
+        const position = asset.inject === 'HTML_END' ? positionJavaScriptEntry : asset.inject;
+        htmlTags.push({ htmlTag, position });
+    });
     return htmlTags;
 }
-async function getMergedScriptTag(pageAssets, isProduction) {
-    const scriptAssets = pageAssets.filter((pageAsset) => pageAsset.isEntry && pageAsset.assetType === 'script');
+async function mergeScriptEntries(pageAssets, isProduction) {
+    const scriptEntries = pageAssets.filter((pageAsset) => pageAsset.isEntry && pageAsset.assetType === 'script');
     const viteScripts = await getViteDevScripts();
-    const scriptTagsHtml = `${viteScripts}${scriptAssets.map((asset) => inferAssetTag(asset)).join('')}`;
+    const scriptTagsHtml = `${viteScripts}${scriptEntries.map((asset) => inferAssetTag(asset)).join('')}`;
     const scriptTag = mergeScriptTags(scriptTagsHtml, isProduction);
     return scriptTag;
 }
-function getPageContextTag(pageContext) {
+function getPageContextJsonScriptTag(pageContext) {
     const pageContextSerialized = sanitizeJson(serializePageContextClientSide(pageContext));
     const htmlTag = `<script id="vike_pageContext" type="application/json">${pageContextSerialized}</script>`;
     // @ts-expect-error
     pageContext._pageContextHtmlTag = htmlTag;
     return htmlTag;
 }
-function assertInjectFilterEntries(injectFilterEntries, stamp) {
+function assertInjectFilterEntries(injectFilterEntries) {
     try {
-        assertInjectFilterUsage(injectFilterEntries, stamp);
+        checkForWrongUsage(injectFilterEntries);
     }
     catch (err) {
         if (err?.message.includes('[Wrong Usage]')) {
@@ -141,7 +151,11 @@ function assertInjectFilterEntries(injectFilterEntries, stamp) {
         throw err;
     }
 }
-function assertInjectFilterUsage(injectFilterEntries, stamp) {
+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')}`);
@@ -150,6 +164,28 @@ function assertInjectFilterUsage(injectFilterEntries, stamp) {
         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 === 5);
+        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
+            });
+        }
     });
 }

package/dist/esm/node/runtime/html/injectAssets/inferHtmlTags.d.ts

@@ -1,7 +1,9 @@
 export { inferAssetTag };
 export { inferPreloadTag };
 export { inferEarlyHintLink };
+export { scriptAttrs };
 import type { PageAsset } from '../../renderPage/getPageAssets.js';
+declare const scriptAttrs = "type=\"module\" async";
 declare function inferPreloadTag(pageAsset: PageAsset): string;
 declare function inferAssetTag(pageAsset: PageAsset): string;
 declare function inferEarlyHintLink(pageAsset: PageAsset): string;

package/dist/esm/node/runtime/html/injectAssets/inferHtmlTags.js

@@ -1,7 +1,10 @@
 export { inferAssetTag };
 export { inferPreloadTag };
 export { inferEarlyHintLink };
+export { scriptAttrs };
 import { assert } from '../../utils.js';
+// We can't use `defer` here. With `defer`, the entry script won't start before `</body>` has been parsed, preventing partial hydration during SSR streaming, see https://github.com/vikejs/vike/pull/1271
+const scriptAttrs = 'type="module" async';
 function inferPreloadTag(pageAsset) {
     const { src, assetType, mediaType } = pageAsset;
     const rel = getRel(pageAsset);
@@ -21,10 +24,7 @@ function inferAssetTag(pageAsset) {
     const { src, assetType, mediaType } = pageAsset;
     if (assetType === 'script') {
         assert(mediaType === 'text/javascript');
-        // Using <script async> seems problematic:
-        //  - in dev: https://github.com/vikejs/vike/issues/524
-        //  - in prod: https://github.com/vikejs/vike/issues/567
-        return `<script type="module" src="${src}" defer></script>`;
+        return `<script src="${src}" ${scriptAttrs}></script>`;
     }
     if (assetType === 'style') {
         return `<link rel="stylesheet" type="text/css" href="${src}">`;

package/dist/esm/node/runtime/html/injectAssets/mergeScriptTags.js

@@ -1,5 +1,6 @@
 export { mergeScriptTags };
 import { assert } from '../../utils.js';
+import { scriptAttrs } from './inferHtmlTags.js';
 const scriptRE = /(<script\b(?:\s[^>]*>|>))(.*?)<\/script>/gims;
 const srcRE = /\bsrc\s*=\s*(?:"([^"]+)"|'([^']+)'|([^\s'">]+))/im;
 const typeRE = /\btype\s*=\s*(?:"([^"]+)"|'([^']+)'|([^\s'">]+))/im;
@@ -32,7 +33,7 @@ function mergeScriptTags(scriptTagsHtml, isProduction) {
                 }
             });
             if (contents.length > 0) {
-                scriptTag += `<script type="module" defer>\n${contents.join('\n')}\n</script>`;
+                scriptTag += `<script ${scriptAttrs}>\n${contents.join('\n')}\n</script>`;
             }
         }
     }

package/dist/esm/node/runtime/html/renderHtml.js

@@ -174,7 +174,7 @@ async function renderTemplate(templateContent, pageContext) {
         };
         assertUsage(!isPromise(templateVar), getErrMsg('a promise', `Did you forget to ${pc.cyan('await')} the promise?`));
         if (templateVar === undefined || templateVar === null) {
-            assertWarning(false, getErrMsg(`${pc.cyan(String(templateVar))} which will be converted to an empty string`, `Pass an empty string instead of ${pc.cyan(String(templateVar))} to remove this warning.`), { onlyOnce: false });
+            assertWarning(false, getErrMsg(`${pc.cyan(String(templateVar))} which will be converted to an empty string`, `Pass the empty string ${pc.cyan("''")} instead of ${pc.cyan(String(templateVar))} to remove this warning.`), { onlyOnce: false });
             templateVar = '';
         }
         {

package/dist/esm/node/runtime/renderPage/getPageAssets/retrieveAssetsProd.js

@@ -12,8 +12,7 @@ function retrieveAssetsProd(clientDependencies, clientManifest, includeAssetsImp
         if (onlyAssets) {
             if (!includeAssetsImportedByServer)
                 return;
-            // We assume that all npm packages have already built their Vike page files.
-            //  - Bundlers (Rollup, esbuild, tsup, ...) extract the CSS out of JavaScript => we can assume JavaScript to not import any CSS/assets
+            // We assume that all npm packages have already built their files: bundlers (Rollup, esbuild, tsup, ...) extract the CSS out of JavaScript => we can assume JavaScript to not import any CSS/assets.
             if (isNpmPackageImport(id))
                 return;
             if (id.includes('.page.server.')) {
@@ -49,7 +48,7 @@ function collectAssets(manifestKey, assetUrls, visistedAssets, manifest, onlyCol
         assetUrls.add(`/${asset}`);
     }
 }
-// Support `config.build.cssCodeSplit: false`, https://github.com/vikejs/vike/issues/644
+// Support `config.build.cssCodeSplit: false`, see https://github.com/vikejs/vike/issues/644
 function collectSingleStyle(assetUrls, manifest) {
     const style = manifest['style.css'];
     if (style && Object.values(manifest).filter((asset) => asset.file.endsWith('.css')).length === 1) {

package/dist/esm/node/runtime/renderPage/getPageAssets/sortPageAssetsForEarlyHintsHeader.js

@@ -20,6 +20,12 @@ function sortPageAssetsForEarlyHintsHeader(pageAssets) {
         if (assetType === 'image')
             return priority;
         priority--;
+        if (assetType === 'video')
+            return priority;
+        priority--;
+        if (assetType === 'audio')
+            return priority;
+        priority--;
         // Others
         if (assetType !== 'script')
             return priority;

package/dist/esm/node/runtime/renderPage/inferMediaType.d.ts

@@ -1,7 +1,7 @@
 export { inferMediaType };
 export type { MediaType };
 type MediaType = null | {
-    assetType: 'image' | 'script' | 'font' | 'style';
-    mediaType: 'text/javascript' | 'text/css' | 'image/jpeg' | 'image/png' | 'image/webp' | 'image/gif' | 'image/svg+xml' | 'font/ttf' | 'font/woff' | 'font/woff2';
+    assetType: 'image' | 'script' | 'font' | 'style' | 'audio' | 'video' | 'document' | 'fetch' | 'track' | 'worker' | 'embed' | 'object';
+    mediaType: 'text/javascript' | 'text/css' | 'image/jpeg' | 'image/png' | 'image/webp' | 'image/gif' | 'image/svg+xml' | 'font/ttf' | 'font/woff' | 'font/woff2' | 'video/mp4' | 'video/webm' | 'video/ogg' | 'video/mpeg' | 'video/x-msvideo' | 'video/quicktime' | 'audio/mpeg' | 'audio/wav' | 'audio/ogg' | 'audio/aac' | 'audio/midi' | 'audio/flac';
 };
 declare function inferMediaType(href: string): MediaType;

package/dist/esm/node/runtime/renderPage/inferMediaType.js

@@ -34,5 +34,43 @@ function inferMediaType(href) {
     if (href.endsWith('.woff2')) {
         return { assetType: 'font', mediaType: 'font/woff2' };
     }
+    // Videos
+    if (href.endsWith('.mp4')) {
+        return { assetType: 'video', mediaType: 'video/mp4' };
+    }
+    if (href.endsWith('.webm')) {
+        return { assetType: 'video', mediaType: 'video/webm' };
+    }
+    if (href.endsWith('.ogv')) {
+        return { assetType: 'video', mediaType: 'video/ogg' };
+    }
+    if (href.endsWith('.mpeg') || href.endsWith('.mpg')) {
+        return { assetType: 'video', mediaType: 'video/mpeg' };
+    }
+    if (href.endsWith('.avi')) {
+        return { assetType: 'video', mediaType: 'video/x-msvideo' };
+    }
+    if (href.endsWith('.mov') || href.endsWith('.qt')) {
+        return { assetType: 'video', mediaType: 'video/quicktime' };
+    }
+    // Audios
+    if (href.endsWith('.mp3')) {
+        return { assetType: 'audio', mediaType: 'audio/mpeg' };
+    }
+    if (href.endsWith('.wav')) {
+        return { assetType: 'audio', mediaType: 'audio/wav' };
+    }
+    if (href.endsWith('.ogg')) {
+        return { assetType: 'audio', mediaType: 'audio/ogg' };
+    }
+    if (href.endsWith('.m4a')) {
+        return { assetType: 'audio', mediaType: 'audio/aac' };
+    }
+    if (href.endsWith('midi') || href.endsWith('.mid')) {
+        return { assetType: 'audio', mediaType: 'audio/midi' };
+    }
+    if (href.endsWith('.flac')) {
+        return { assetType: 'audio', mediaType: 'audio/flac' };
+    }
     return null;
 }

package/dist/esm/shared/page-configs/assertExports.js

@@ -28,13 +28,20 @@ function assertExports(fileExports, filePathToShowToUser, configName) {
         if (exportsRelevant.length === 1) {
             return;
         }
-        else {
-            assert(exportsRelevant.length === 0);
-            let errMsg = `${filePathToShowToUser} doesn't export any value, but it should have a ${pc.cyan('export default')}`;
+        const exportDefault = pc.cyan('export default');
+        const exportConfigName = pc.cyan(`export { ${configName} }`);
+        if (exportsRelevant.length === 0) {
+            let errMsg = `${filePathToShowToUser} doesn't export any value, but it should have a ${exportDefault}`;
             if (configName)
-                errMsg += ` or ${pc.cyan(`export { ${configName} }`)}`;
+                errMsg += ` or ${exportConfigName}`;
             assertUsage(false, errMsg);
         }
+        else {
+            assert(exportsRelevant.length === 2);
+            assertWarning(false, `${filePathToShowToUser} remove ${exportConfigName} or ${exportDefault}`, {
+                onlyOnce: true
+            });
+        }
     }
     else {
         // !configName => isConfigFile

package/dist/esm/utils/projectInfo.d.ts

@@ -1,13 +1,13 @@
 export { projectInfo };
 export type { ProjectTag };
 export { PROJECT_VERSION };
-declare const PROJECT_VERSION: "0.4.148";
+declare const PROJECT_VERSION: "0.4.149-commit-041ee42";
 type PackageName = typeof projectInfo.npmPackageName;
 type ProjectVersion = typeof projectInfo.projectVersion;
 type ProjectTag = `[${PackageName}]` | `[${PackageName}@${ProjectVersion}]`;
 declare const projectInfo: {
     projectName: "Vike";
-    projectVersion: "0.4.148";
+    projectVersion: "0.4.149-commit-041ee42";
     npmPackageName: "vike";
     githubRepository: "https://github.com/vikejs/vike";
 };